how to use indented spacing on blog

  • Unknown's avatar

    hi there!

    I have a poetry blog and am having difficulty with the formatting. If I indent lines or use weird spacing, wordpress automatically left aligns everything – this is not what I want.

    The only way I have found is to insert
    <pre> at the beginning of the poem and </pre>
    at the end of the poem. this keeps the formatting, but the font changes to HTML style and it gets shaded in blue/grey.

    Does anyone know how to fix this problem – I know nothing about CSS! Please help! Any advice would be SO appreciated :)

    Thank you

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar

    Can you perhaps take a screenshot of what it is you are trying to accomplish, upload it to your Media Library and then post a link to that image so that I can take a look? I’ll see what I can do to come up with solutions that will require the least to get what you want.

  • Unknown's avatar

    Thank you so much! I have uploaded an image, it is named Capture… This is the effect I want, but for it to be in the normal view consistent with my Theme and not as it appears. I have been doing some research and discovered you can use the following coding in the HTML view to add spacing, it is supposed to fix the issue I have been experiencing:

     

    Unfortunately I have the same problem as many other people describe online, the text editor simply deletes the coding for some reason from the HTML view.

    Thank you so much for your assistance!
    Kathryn

  • Unknown's avatar

    Hi Kathryn, looking at your example, The indent at the beginning of lines would best be accomplished by assigning a CSS class and then creating a CSS rule for that class that indents the line. For the spaces in between words, I would suggest using the following (without the space between the & and e).
    & ensp;
    Here is my html markup to accomplish what is in your example, with the CSS needed following that. You would enter this from within the Text/HTML tab in the editor in both of the below cases.

    <p>That people</p>
    
    <p class="my-indent">are still reading</p>
    
    <p class="my-indent">books     in this</p>
    
    <p class="my-indent">world     gone</p>
    
    <p>haywire is proof</p>
    
    <p class="my-indent">enough</p>
    
    <p>of miracles.</p>

    And here is the CSS.

    .my-indent {
    	padding-left: 40px;
    }

    Alternately, if you didn’t want to go the CSS route, you can use inline style declarations for the indent such as this.

    <p>That people</p>
    
    <p style="padding-left: 40px;">are still reading</p>
    
    <p style="padding-left: 40px;">books     in this</p>
    
    <p style="padding-left: 40px;">world     gone</p>
    
    <p>haywire is proof</p>
    
    <p style="padding-left: 40px;">enough</p>
    
    <p>of miracles.</p>

    One note on both of the above, the beginning and ending “p” html tags on the lines that do not have a CSS class or inline style declaration will have the “p” tags stripped out by the WordPress software.

  • The topic ‘how to use indented spacing on blog’ is closed to new replies.