HTML Paragraphs

HTML paragraphs are created with the <p> element. Each paragraph starts on a new line, and browsers add some space above and below it automatically.

Writing Paragraphs

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Paragraphs</title></head>
<body>
  <p>The first paragraph introduces the topic.</p>
  <p>The second paragraph adds more detail.</p>
</body>
</html>

Whitespace Is Collapsed

Browsers collapse multiple spaces and line breaks in your source code into a single space. That means you cannot format text by pressing Enter or Space many times in the editor.

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Whitespace</title></head>
<body>
  <p>
    These     words
    are spread      over
    several lines in the code.
  </p>
</body>
</html>

Line Breaks and Horizontal Rules

Use <br> to break a line inside a paragraph, such as in an address or poem. Use <hr> to mark a change of topic between paragraphs.

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>br and hr</title></head>
<body>
  <p>Naeem Amin<br>Main Boulevard<br>Lahore, Pakistan</p>
  <hr>
  <p>A new topic starts after the rule.</p>
</body>
</html>

Preformatted Text with pre

The <pre> element keeps spaces and line breaks exactly as written and uses a monospace font. It is ideal for code samples or ASCII art.

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>pre</title></head>
<body>
<pre>
  Name      Score
  Ali         92
  Sara        88
</pre>
</body>
</html>

Adding Space the Right Way

Avoid empty <p></p> tags or rows of <br> to create space. Use CSS margin and padding instead. If you truly need a non-breaking space between two words, use the &nbsp; entity.

Frequently asked questions

How do I add a line break in HTML?

Use the <br> element. For spacing between blocks of content, prefer CSS margins instead of many <br> tags.

Why does HTML ignore my extra spaces?

HTML collapses whitespace by design. Use <pre>, the &nbsp; entity, or the CSS white-space property when spaces must be preserved.

Can a paragraph contain a div?

No. A <p> can only contain inline (phrasing) content. Putting a <div> inside makes the browser close the paragraph early.