How to interprate space between paragraphs in CSS?

Question

I'm trying to achieve the following:

Let's say I have a blog post that is written in basic HTML. I have a dilema on paragraphs spacing. Let's say I don't want to add a <p> tag for every paragraph, so I want only one that will render the following:

<p> 
This is my paragraph.
<!-- THIS SPACE I WANT IT IN CSS -->
This is my second paragraph.
</p>

Basically, I want to add an extra blank line every time when user space out its paragraph. I want it in CSS, without using two <p> tag for each paragraphs above.

How can I do that?

I think you're looking for `line-height` in CSS. It acts like a line-spacing between paragraphs everytime you want to break your paragraph — Shiz, Sep 02 '19 at 09:10
"Let's say I don't want to add a `
` tag for every paragraph" — Let's not. Start by writing high quality HTML. Then worry about how it looks. — Quentin, Sep 02 '19 at 09:15
Using `
` will solve your problem. For further information I suggest you check out https://developer.mozilla.org/en-US/docs/Web/HTML/Element/br. — , Sep 02 '19 at 10:37

score -1 · Answer 1 · answered Sep 02 '19 at 09:09

There are multiple option which you can try. check snippet.

p span {
  padding-top: 20px;
  display: block;
}

<p>
  This is my paragraph.
  <br><br> This is my second paragraph.
</p>


<h2>try this</h2>

<p>
  This is my paragraph.
</p>
<p>
  This is my second paragraph.
</p>



<h2>Or try this</h2>

<p>
  This is my paragraph.
  <span>  This is my second paragraph.</span>
</p>

How to interprate space between paragraphs in CSS?

1 Answers1