Specifying a line break will force a line to break at that point. For inline text, this means that the text will continue on the next line. For other elements before it, such as a paragraph or another line break, this will create an empty line, or space, between the previous line and the following line. This behavior, however, should be avoided as it is not semantically correct. A line break should only be used to break inline text (images, links, etc). Creating space above or below elements should be achieved using margins and padding in CSS. Some practical uses for a line break would include: starting a new line in a poem or postal address, breaking lines to make them all a certain number of characters long, or creating a break after a salutation.

Notice on self-closing tags. In XHTML, this tag is required to be closed using <br />. In HTML 4, this is considered invalid syntax, but in HTML 5 it is acceptable to use this method of closing the tag, even though it is not required.

Common Attributes

Attribute Name

Values Allowed

Description

Status

clear

all

left

none

right

Ensures that any content aligned to the left, right, or both sides gets cleared.
Deprecated: Use the CSS clear property instead.

Note: These may not be the only attributes available to use with this element, but they are the most common attributes.

Browser Compatibility

Internet Explorer				Firefox					Chrome			Opera				Safari
6.0	7.0	8.0	9.0	3.5	4.0	7.0	8.0	9.0	14.0	15.0	16.0	11.0	11.1	11.5	11.6	3.2	4.0	5.0	5.1

Default Style Rules

The following declarations in the default style sheet will affect this element.

br:before { content: "\A"; white-space: pre-line }

Example and Explanation

In the following example, we have an image which is floated to the right side of a block of text.

<img src="/path/to/image" alt="[img]" style="height: 100px; float: right" />
Some block of text...

Say I want to add a small line of text, which is bolded, as the first line and have the rest of the text go below that. What we can do is add a line break after the first line of text so that the rest of it will start on the next line.

<img src="/path/to/image" alt="[img]" style="height: 100px; float: right" />
<span style="font-weight: bold">I am the king of the world.</span><br />
Some block of text...

The following continuation of this example is deprecated. Use the CSS clear property instead.

After this text and image, we have more content below. We face a problem though. We only have a couple lines of text and an image floated to the right that expands to a height of 100 pixels. The text from the paragraph below is also being pushed to the left by the image, but we don't want it to do that. Our solution: clear the image.

<img src="/path/to/image" alt="[img]" style="height: 100px; float: right" />
<span style="font-weight: bold">I am the king of the world.</span><br />
Some block of text...<br clear="right" />
<p>The next paragraph, and so on...</p>

Looking to play around with elements and their attributes? We like playing around too! We also know of a special place that is specifically designed to let you play around with HTML, CSS, and JavaScript. It's called jsFiddle. Check it out and test the functionality of elements on your own.

Do you see inaccurate or outdated information? Even if it's just a simple spelling or grammar error, we want to know about it! Send any inquiries you have about our content to webmaster@animuson.net so that we can keep all of our information as accurate and professional as possible.

What do the different colors mean?

Normal Element This element has not been changed recently and has no notes attached to it.	New Element This element was just added to the definitions in the most recent version.	Use Caution This element should be avoided without proper understanding and/or has a better alternative.
Modified Behavior This element and/or its behavior has been modified from its original functionality.	Deprecated This element should be avoided since it has been deprecated in the most recent version.	Not Supported This element should not be used at all since it is no longer or was never supported.