When to use <p> vs. <br> [closed] - html

Question

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 4 years ago.
Improve this question
What's the verdict on when you should use another <p>...</p> instead of a <br /> tag? What's are the best practices for this kind of thing?
I looked around for this question, but most of the writing seems a bit old, so I'm not sure whether opinions about this topic have evolved since.
EDIT: to clarify the question, here is the situation that I am dealing with. Would you use <br>'s or <p>'s for the following content (imagine it's contained in a div on a homepage):
Welcome to the home page.
Check out our stuff.
You really should.
Now, these lines are not technically 'paragraphs'. So would you mark this up by surrounding the whole block in a <p> tag with <br>'s in between, or instead use separate <p>'s for each line?

Answer 1

They serve two different functions.
<p> (paragraph) is a block element which is used to hold text. <br /> is used to force a line break within the <p> element.
Example
<p>Suspendisse sodales odio in felis sagittis hendrerit. Donec tempus laoreet
est bibendum sollicitudin. Etiam tristique convallis<br />rutrum. Phasellus
id mi neque. Vivamus gravida aliquam condimentum.</p>
Result
Suspendisse sodales odio in felis sagittis hendrerit. Donec tempus laoreet
est bibendum sollicitudin. Etiam tristique convallisrutrum. Phasellus
id mi neque. Vivamus gravida aliquam condimentum.
Update
Based on the new requirements, I would personally use <p> to achieve the spacing as well as allow for styling. If in the future you wish to style one of these parts, it will be much easier to do so at the block level.
<p>Welcome to the home page.</p>
<p style="border: 1px solid #00ff00;">Check out our stuff.</p>
<p>You really should.</p>

Answer 2

You want to use the <p> tag when you need to break up two streams of information into separate thoughts.
<p> Now is the time for all good men to come to the aid of their country. </p>
<p>The quick brown fox jumped over the lazy sleeping dog.</p>
The <br/> tag is used as a forced line break within the text flow of the web page. Use it when you want the text to continue on the next line, such as with poetry.
<p> Now is the time for all good men to come to the aid of their country. <br/>
The quick brown fox jumped over the lazy sleeping dog. </p>
source

Answer 3

You should use <p> when you want to separate two paragraphs. From Wikipedia:
A paragraph (from the Greek paragraphos, "to write beside" or "written
beside") is a self-contained unit of a discourse in writing dealing
with a particular point or idea.
Use the <br> tag when you want to force a new line inside your paragraphs.

Answer 4

I may be breaking rules of etiquette when answering a question in this thread —as most of the answers thus far have been great —but here's how I approach this argument:
While I agree that a 'p' is element which is used to hold text and a 'br' tag is used to break text, in many occasions one may want to manipulate a 'block' of text that have actual line spaces between them;
Ex:
[my block of text]
Hello World!
--------this is a blank line------
You are so full of life!
[/my block of text]
Now many would argue that you can just place two 'p' elements in a 'div' and then manipulate that 'div', however I feel this is more time consuming (aka I'm lazy), and thus I stick with a double 'br' method —leaving me to manipulate just that one 'p.'
The issue with my unorthodox method is that if there is a specific styling applied to line-height, then there will definitely be a noticeable difference between the line-space created by a double 'br' vs. a 'p'.
I guess in when deciding which technique to follow, consider:
code readability
best practices
time
effects of shortcuts on the rest of your code

Answer 5

I wouldn't use <p> unless you intend to put content within it. Of course, this is merely an opinion (as I assume most answers will be).
However, it may be easier to style a <p> tag (there are more options at least) which may lend itself to be used more often. My only problem is that this is not very easy to read (when reading code) and I feel like those styles could be applied elsewhere (possibly to the tags that would surround the <p> tag.
Also, as other have stated, a <br /> tag should be used to separate content within a block element (such as the <p> tag). If you are using the following:
<p class="a">some content...</p>
<p class="break"></p>
<p class="b">some other content...</p>
Then I would argue that you should use styles on one or both of the tags surrounding the p.break tag to do any spacing that is required.

Answer 6

The p tag is a block level element, and is mainly used to add content, whereas the br tag is used to force a line-break within the element. That is, if you're going to follow semantics. A lot of people are doing that these days to add specific meaning to tags and whatnot. I hope that helps. Good luck, though. =)