4 Simple Ways to Insert Spaces in HTML

In a simple text document, you can simply press the space bar to insert multiple spaces. However, it is not so easy to insert spaces in HTML web pages. It doesn’t matter how many times you press the space bar in HTML, the browser will only display one space.

Therefore, you should insert HTML tags before and after the text to determine its format. To achieve this, we will show you 4 methods for inserting spaces in HTML.

Inserting spaces in HTML with the Non-Breaking Space (&nbsp) tag

One of the easiest ways to insert spaces in HTML is to use the non-breaking space tag. This tag allows you to insert a space in the same line. In other words, two elements separated by the ( ) character will not break into a new line.

For example, if you insert spaces and split two parts of “8:00 PM” or “2 000 000” into a new line, this may cause confusion for readers. To avoid a line break when entering numbers and times in this case, you should insert spaces with this tag.

insert spaces in html using nonbreaking space tag

Inserting spaces in HTML with the Preformatted Text (<pre>) tag

Another tag that is used to insert preformatted text into an HTML document is the <pre> character.

After using this tag, the browser retains the existing spaces and line breaks in your text. The spaces that are displayed on the web page therefore correspond to what you enter.

add spaces in html via preformatted text

Therefore, adding spaces in HTML with this tag is useful to set a format for displaying a code or a poem.

Changing spaces in HTML with the Break (<br>) tag

While most people use a non-breaking space to insert spaces on the same line, the <br> tag helps you add a line break.

insert spaces in html using break tag

It is especially used to form a block format, e.g. to present an address. This line break can make it easier for readers to understand without using a new paragraph element.

Customizing spaces in HTML with the paragraph (<p>) tag

The <p> element stands out as a good way to insert a single blank line in HTML.

You can insert the <p> character in HTML to create a paragraph break. The browser creates a space that separates the paragraphs so that contiguous paragraphs are easier to read.

adjust spaces in html via paragraph tag

Thanks to the paragraph tag, you can separate one block of text from another with a space and/or an indent in the first line.

Conclusion

Now you know 4 useful methods for inserting spaces in HTML.

Each method provides different results when displaying spaces in HTML. Depending on the layout of your content, you need to select a suitable tag from the 4 mentioned.

If you still have any questions about how to insert white space in HTML, please leave your thoughts in the comments section below.

To make advanced customizations if your site crashes, check out our guide to editing HTML in WordPress pages and posts.