Html – How to add a space between paragraphs when using css reset?

csshtml

What is the safest/no height change cross-browser way to add a space between paragraphs when using css reset?

<div>
<p class="text">paragraph1</p>
<p>&nbsp;</p>
<p class="text">paragraph2</p>
</div>
<div>
<p class="text">paragraph1</p>
<br>
<br>
<p class="text">paragraph2</p>
</div>

http://jsfiddle.net/unknown601/0ewvk3c9/

Best Solution

I find it useful to include space between adjacent paragraphs.

Example: http://jsfiddle.net/kppb0nLx/3/

/* a paragraph proceeded by another paragraph will have a top margin */
p + p {
    margin-top: 8px;
}

This allows you to keep paragraphs flush with the top/bottom of your container while still having space between them.

The options you listed (br and p purely for spacing) are not considered good practice. They don't represent the your content semantically and they create extra markup that can easily be replaced with CSS.

More Reading