Difference between <br> & <p>

Hi, very new to this so sorry for dumb questions. Wondering the difference between <br> and
<p>and why use <br>

when you could hit enter and start a new <p>.

I’m entirely sure I’m missing something obvious but would love to get this explained a bit better.

Hello @object4900495644,

A <p> element stands for paragraph, used to section off a text.
A <br> tells the browser to implement a line break.

For example if you have a paragraph that requires a line break in the middle, you would do the following:

<p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc et luctus dolor. Pellentesque quis faucibus ligula, id interdum ligula. Etiam sit amet auctor ligula. In pulvinar, est condimentum volutpat bibendum, mi justo aliquam ligula, vitae lacinia nunc sem sit amet massa. Sed dapibus varius elit. Vestibulum iaculis felis urna, ac congue neque sodales vel. <br></br> Quisque vel nulla pulvinar, sollicitudin dui at, egestas nisl. Nulla massa nunc, varius ac blandit in, pulvinar nec odio. Nullam luctus mi mi, at rhoncus erat sodales placerat. Duis dictum nisi id pretium malesuada. Nulla feugiat, sapien eget porttitor feugiat, ex enim fringilla mi, a pulvinar lacus purus a odio. Nulla facilisi. Integer vel diam ipsum. Proin sit amet pretium diam. Etiam et dapibus arcu, eu porttitor urna. </p>

This would result in:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc et luctus dolor. Pellentesque quis faucibus ligula, id interdum ligula. Etiam sit amet auctor ligula. In pulvinar, est condimentum volutpat bibendum, mi justo aliquam ligula, vitae lacinia nunc sem sit amet massa. Sed dapibus varius elit. Vestibulum iaculis felis urna, ac congue neque sodales vel.

Quisque vel nulla pulvinar, sollicitudin dui at, egestas nisl. Nulla massa nunc, varius ac blandit in, pulvinar nec odio. Nullam luctus mi mi, at rhoncus erat sodales placerat. Duis dictum nisi id pretium malesuada. Nulla feugiat, sapien eget porttitor feugiat, ex enim fringilla mi, a pulvinar lacus purus a odio. Nulla facilisi. Integer vel diam ipsum. Proin sit amet pretium diam. Etiam et dapibus arcu, eu porttitor urna.

Sure you could apply 2 paragraph elements below each other but the browser would recognize them as two paragraphs and not as one. This may cause conflict with your text structure, CSS styling and for instance templates/ auto filled text.

Ow and by the way, there is no such thing as a dumb question. Here you can ask anything code related. We all had to learn at some point :wink:

Happy coding!

2 Likes