

The element is one of the first you’ll learn as a beginner, and for good reason. Or, you can use an HTML tag, as we’ll see next. If you want to add extra whitespace between pieces of text, use CSS padding and margins instead for cleaner code. The break tag is meant for single line breaks, and not more than one in a row. See the Pen HTML Space: br example by Christina Perricone ( on CodePen. The break tag is useful for instances where a line break is necessary to understand the content, but where you don’t want to necessarily use a new paragraph element, such as in an address: You don’t need a closing tag here - just writing adds a line break. If you want to insert a line break, use the HTML break tag, written as. If you want to prevent a line break between two words, use a non-breaking space. Note that web browsers apply a monospaced font to text inside tags, but you can easily override this with the CSS font-family property. See the Pen HTML Space: pre example by Christina Perricone ( on CodePen. To preformat your text, place it inside a tag: Preformatting is useful for text content with a visual component, like poetry or ASCII art. When the HTML is rendered in the browser, the text will look like it does in the HTML file. HTML Preformatted Text () TagĪnother way to prevent your HTML spaces from collapsing is by preformatting your HTML text, which retains all spaces and line breaks in your HTML.
W3SCHOOLS IFRAME DOWNLOAD
Want to learn more about HTML? Download our free guide for best practices for getting started with HTML.

Learn More: The Beginner's Guide to HTML & CSS Also, avoid using a non-breaking space for styling reasons, like indenting or centering an element on a page - styling should be handled with CSS. While can come in handy, it shouldn’t be used excessively, since avoiding line breaks may cause problems with rendering the content in the browser.

See the Pen HTML Space: ensp and emsp example by Christina Perricone ( on CodePen. This is useful if splitting two pieces of text would be confusing for the reader, such as in the case of “9:00 AM” or “1 000 000.”įinally, you can use the additional HTML entities &ensp and &emsp to add two and four non-breaking spaces respectively: The only difference is that this space will never break to a new line - two words or elements separated by will always appear on the same line. When rendered in the browser, a non-breaking space will look just like a normal space. See the Pen HTML Space: nbsp example by Christina Perricone ( on CodePen. Multiple adjacent non-breaking spaces won’t be collapsed by the browser, letting you “force” several visible spaces between words or other page elements. The simplest way to add a space in HTML (besides hitting the spacebar) is with the non-breaking space entity, written as or. However, if you want to add space for styling purposes (for instance, whitespace between elements), we recommend using CSS instead - jump to the next section to learn how. If your content requires extra spacing to make sense, you can try any of the methods below.
