WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] How do I make a Double Space between Paragraphs? (15 posts)

  1. rustybulb
    Member
    Posted 3 years ago #

    Hi,

    I have two product reviews on one page, and would like to put a small gap between the end of the first one and the beginning of the second.

    But no matter how many times I press Enter or put line breaks in HTML, I still only have one single gap between the paragraphs.

    Anyone know how to solve this please?

    Thank you

  2. FishDogFish
    Member
    Posted 3 years ago #

    Assign a class to your <p> elements.

    Example:<p class="DoubleSpace"> bla bla bla</p>

    And in the style.css

    .DoubleSpace{margin-bottom:30px;}

  3. rustybulb
    Member
    Posted 3 years ago #

    Hi FishDogFish, thanks for your reply.

    1. Do I do the first part in the page HTML?

    2. I can't find .DoubleSpace in style.css. If it is not there, where do I put it please?

    thanks

  4. FishDogFish
    Member
    Posted 3 years ago #

    1. Do I do the first part in the page HTML?

    Anywhere in your post text that you want to style a paragraph just add the class="whateveryouwant" the <p> tag.

    2. I can't find .DoubleSpace in style.css. If it is not there, where do I put it please?

    Just add it yourself. The best place to add it would be in the "Content" section, since you're using the class to style your content.

    You don't have to name it DoubleSpace, you can name whatever you want. DoulbeSpace makes sense, because you're trying to add a double space between your paragraphs.

    What would really help is for you to read a CSS tutorial.

  5. rustybulb
    Member
    Posted 3 years ago #

    Hi FishDogFish,

    Thanks a lot

    Yes I will read a CSS tutorial.

    I tried what you said and I must have done it wrong.

    I put xxxxxxxxxxxx in place of bla bla bla just as a test, and was expecting a double space between the XXs and the next header, but there isn't.

    I put the code at the bottom of the content in style.css after making a copy. So it looked like this:

    #content .video-player {
    	padding: 0;
    }
    
    .DoubleSpace{margin-bottom:30px;}
    
    /* Asides
    -------------------------------------------------------------- */

    it's at http://bestcompoundmitersaws.info/makita-compound-saw/ if you have time to check

    thanks a lot

  6. Alexandru Vornicescu
    Member
    Posted 3 years ago #

    you can add <br><br>

    between were you need to.

  7. rustybulb
    Member
    Posted 3 years ago #

    Thanks alexvorn2,

    But I tried that first. That works on normal websites, but not on my WP site.

    Or did you mean as well as the coding that FishDogFish said?

    I tried both ways and it didn't work.

    thanks

  8. WordPress strips out what it sees as extra returns and paragraph breaks in the visual editor. It's well known gripe. <br><br> won't work, nor will <br /><br />.

    You can fool wordpress into giving you extra space (by which I mean paragraph breaks) by adding a space or two in between bold tags, like this:

    <strong> </strong>

    Do that in the html editor; you won't be able to see it in the visual editor. WP sees the bold tags and assumes text is there, so it adds a paragraph break. It's ugly, but it works.

  9. FishDogFish
    Member
    Posted 3 years ago #

    I tried what you said and I must have done it wrong.

    I put xxxxxxxxxxxx in place of bla bla bla just as a test, and was expecting a double space between the XXs and the next header, but there isn't.

    You have to assign the class to the p element or the css won't know what to style. <p class="DoubleSpace"

    Also you might have to apply more than 30px of margin. Try 100px of margin and see if there is a difference.

  10. rustybulb
    Member
    Posted 3 years ago #

    Songdogtech, thanks but <strong> </strong>didn't work either.

    FishDogFish, I did. I put:
    <p class="DoubleSpace"> xxxxxx</p>

    exactly how you said above. I also changed 30 to 100 in style.css. But still no success.

    thanks

  11. Works for me in the html editor in WP3. Make sute there's a space or two in between
    <strong> and </strong>

  12. FishDogFish
    Member
    Posted 3 years ago #

    FishDogFish, I did. I put:
    <p class="DoubleSpace"> xxxxxx</p>

    Anyway,

    It seems the spacing that is applied by the external style sheet is being striped off, but only on the p tags.

    What you can do instead of using the external styling is use Inline Styling.

    Example: <p style="margin-bottom:35px">bla bla bla</p>

  13. rustybulb
    Member
    Posted 3 years ago #

    Yay!

    <p style="margin-bottom:70px">bla bla bla</p>

    worked, thanks FishDogFish!

    Thanks also SongDogTech. I put two spaces in between, honestly! This works on another blog (so thanks for that!) but not this one (also v.3), so it makes me think it's the theme I'm using that's blocked it. I am using Twenty Ten.

    Thanks for your help guys (I like how you both have Dog for a middle name!)

  14. FishDogFish
    Member
    Posted 3 years ago #

    Remember to mark this as [Resolved]

  15. rustybulb
    Member
    Posted 3 years ago #

    right thanks!

Topic Closed

This topic has been closed to new replies.

About this Topic