HTML Paragraphs

What is an HTML paragraph?

An HTML paragraph is a block of text. It may contain one sentence or more. It is similar to what we do while writing essay in simple text.

The HTML <p> element defines a paragraph.

A paragraph always starts on a new line, and browsers automatically add some white space (a margin) before and after a paragraph


<p>First Paragraph</p>
<p>Second Paragraph</p>
<p>Third Paragraph</p>

Problem with HTML Paragraph Tag

HTML Display

You cannot be sure how HTML will be displayed.

Large or small screens, and resized windows will create different results.

With HTML, you cannot change the display by adding extra spaces or extra lines in your HTML code.

The browser will automatically remove any extra spaces and lines when the page is displayed:


<p>This paragraph
contains a lot of lines
in the source code,
but the browser
ignores it.</p>
<p>This paragraph
contains         a lot of spaces
in the source         code,
but the        browser
ignores it.</p>

How to solve this problem?

Let's check the method to solve this problem.

The <pre> Tag

The HTML <pre> element defines preformatted text.

This HTML tag displays the text as it is without removing the blank spaces and line breaks with a predefined font-style Courior


<pre>This paragraph
contains         a lot of spaces
in the source         code,
but the        browser
ignores it.</pre>

The &nbsp; (blank space) code and <br> Tag

The HTML &nbsp; element is used for adding blank space in text.

The <br> is used to display a line break (new line) without adding a new paragraph.


<p>This paragraph<br>contains &nbsp;&nbsp;&nbsp; a lot of spaces<br>
in the source &nbsp;&nbsp;&nbsp; code,<br>but the &nbsp;&nbsp;&nbsp; browser<br>ignores it.</p>