How To Add a Line Break

Line breaks, also known as "newlines" or "linefeeds",  are useful when you need to have a little more control over how a web browser renders your text.  The term "line break" comes from the early computing days when a line of text was literally, well, "broken" by continuing text on the next line below.  Think of typing a line of text on a typewriter or an old-school dot-matrix printer.  You had to return the "carriage" (print head) to the very beginning column on the paper and furthermore advance the paper a bit to start printing on the next line.

While carriages and typewriters are a thing of the past, the concept of a line break still remains.  Often web browsers render your text however they see fit, performing "word wrapping" on your text so that it fills an entire line before "wrapping" to the next line.  But often times you, the HTML developer, are smarter than the browser, and will want to force a particular line to end and begin text output on the next line.  This works well for activities such as writing poetry, when you want a line to end early and a group of words to begin on the next line.

For example, instead of displaying

I want this to show up on multiple lines.

You want to display

I want
this to
show up on

Adding a line break to make this happen is ridiculous easy.  Just add the <BR> tag wherever you want to begin a new line and that's it!

Your HTML code will look something like this:

I want[BR]
this to[BR]
show up on[BR]

The [BR] tag is an empty tag, meaning, unlike most [HTML] tags,  it contains no ending tag.  It has been around for a long time, and is supported by all major browsers.  Note that the <BR> line break element is formally different than the <P> paragraph element and should not be used as a replacement for forming paragraphs.  The difference between a line break and a paragraph is that with a line break there is no additional spacing before the new line.  You want to use <BR> to insert line breaks, not to create paragraphs.

The [BR] tag supports the following standard attributes:


It does not support any event attributes.

Optionally, you can add the CLEAR attribute to the [BR] tag with one of the following values:

right - aligns text to the right of an image
left - aligns text to the left of an image
all - aligns text to the left and right of an image


Share this article!

Follow us!

Find more helpful articles: