How to use the HTML <br> Element

The <br> tag defines an inline element in HTML, that forces a new line (line break) between the text you put it between.

Example:

<p>
The &lt;br&gt; tag <br>forces<br>line<br>breaks in text
</p>

Result:

The <br> tag
forces
line
breaks in text

Good to know about the <br> tag

  • You’ll often see developers use the <br> tag to add space between individual HTML elements, but that’s an incorrect usage. You should use the CSS margin property to apply space between elements.
  • The <br> element is a so-called “empty element” which means that it has no closing tag (unlike most HTML elements). It’s defined with just one tag: <br>
  • If you use line breaks in JSX (for ReactJS) the br element is also defined with only one tag, however, the JSX version requires a forward slash to be valid (as in a closing HTML tag): <br/>
  • Using the <br> element can cause undesirable layout results in responsive typography, so use it carefully, and in my opinion, only if you have to. Often using custom CSS classes is a better alternative than using <br> for text formatting.

Has this been helpful to you?

You can support my work by sharing this article with others, or perhaps buy me a cup of coffee 😊

Kofi

Share & Discuss on