• Resolved rustybulb

    (@rustybulb)


    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

Viewing 14 replies - 1 through 14 (of 14 total)
  • Assign a class to your <p> elements.

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

    And in the style.css

    .DoubleSpace{margin-bottom:30px;}

    Thread Starter rustybulb

    (@rustybulb)

    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

    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.

    Thread Starter rustybulb

    (@rustybulb)

    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 https://bestcompoundmitersaws.info/makita-compound-saw/ if you have time to check

    thanks a lot

    you can add <br><br>

    between were you need to.

    Thread Starter rustybulb

    (@rustybulb)

    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

    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.

    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.

    Thread Starter rustybulb

    (@rustybulb)

    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

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

    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>

    Thread Starter rustybulb

    (@rustybulb)

    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!)

    Remember to mark this as [Resolved]

    Thread Starter rustybulb

    (@rustybulb)

    right thanks!

Viewing 14 replies - 1 through 14 (of 14 total)
  • The topic ‘How do I make a Double Space between Paragraphs?’ is closed to new replies.