Create a Space in HTML (Horizontal & Vertical)

Outside of spaces between text, regular spaces in HTML are not rendered by browsers. In this tutorial, we will learn how to create both horizontal and vertical spaces in HTML that will work anywhere on the page.

 

HTML Space

To create a single space, use the nbsp (non-breaking space) keyword. Here is an example of creating a horizontal space of one character between two span tags:

 

<span>Hello</span>&nbsp;<span>World!</span>

 

HTML Tab Space

To create a tab equal to two space characters in width, use the &ensp keyword like this:

 

<span>Hello</span>&ensp;<span>World!</span>

 

HTML Four Space Tab

To make a tab equal to four regular space characters in length, use the &emsp keyword like this:

 

<span>Hello</span>&emsp;<span>World!</span>

 

 

Vertical Spaces in HTML

To create vertical spaces, use the br tag. like this:

 

<span>Hello</span><br/><span>World!</span>

 

With all the above methods, you can chain multiple keywords/tags together to create larger spaces. This of course should be used within reason or your source code will start to get messy. If you need a large space it is often better to use CSS.