Why I dont see extra line break or space after a paragraph when adding <br> tag after content within <p> tag

Question

0.00/5 (No votes)

See more:

I've encountered a puzzling issue regarding the line break br tag within a p tag. Specifically, I've noticed that when I place the br tag after the content within the p tag, it does not create the expected extra space.

HTML code:

HTML

<p>
This is the first <br>
</p>
<p>
This is second
</p>

It does create a space since the p tag will create a space but I also added br so that means it should create one more line break space.

Why is this not happening

What I have tried:

I tried searching on the Internet but did not find any clear reason.

I tried putting the br tag in between the content of a p t, then it can break the content of paragraph but this br tag does not work if i put it after the content just before the ending p tag

Posted 6-Jul-23 4:17am

R Rawat

Updated 6-Jul-23 4:49am

v4

Add a Solution

3 solutions

Solution 1

I just tried this at W3Schools Tryit Editor[^], and get the same result. Since the break tag is used to break lines of text, I can only assume that the <br> tag tells the browser to move to the next line (same as CR/LF sequence). But the next thing it reads is the </p> so it does nothing and process that tag at the same point.

Posted 6-Jul-23 4:32am

Richard MacCutchan

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

OriginalGriff · Accepted Answer · 2023-07-06T04:49:00

If you want a double space, try:

HTML

<p>
This is the first <br>&nbsp;
</p>
<p>
This is second
</p>
<p>
This is third
</p>

Leading and trailing whitespace is trimmed by the browser, so adding a "non-whitespace blank" forces the line to appear:

BrowserDisplay

This is the first 
  

This is second 

This is third

Dave Kreskowiak · Accepted Answer · 2023-07-06T04:39:00

The BR tag does NOT add a new blank line. It mearly breaks a line of text into two lines. Since you don't have any text after the BR, nothing will happen.

Think of this way. Any text you have between P tags will be one single line of text in HTML. In your sample code, it actually looks like this:

<p>This is the first</p><p>This is second</p>

Since the paragraph tags break the text and inserts blank space between paragraphs, there is nothing visible for the BR tag to do. Without the BR tag, you'll get a single blank line between the paragraphs.

Perhaps you're looking to put the BR between the paragraphs?

<p>This is the first</p><br><p>This is second</p>

This is add extra space between the paragraphs.

Why I dont see extra line break or space after a paragraph when adding <br> tag after content within <p> tag

3 solutions

Solution 1

Solution 3

Solution 2

Add your solution here

Preview 0