How to Make Spaces in HTML

HTML Code
Hamza TArkkol / Getty Images

Adding a string of spaces to your HTML only to have them disappear because of the way HTML handles spaces is a frustrating, familiar experience for anyone who works in web design. An HTML space tag would be convenient for creating spaces, but the fact is that none exists..

The source of the problem is that HTML compresses all space characters — tabs, spaces, and carriage returns — to one character. If you want to indent your paragraphs, you can’t simply type five spaces and then begin the text. That doesn't mean you don't have any control over spaces in your HTML, however.. 

Alternatives to the Nonexistent HTML Space Tag

You have several options for creating and controlling white space on your webpages:

  • The HTML <br> tag denotes a line break, like a carriage return in a word processing program. You'd use it at the end of each line of an address, for example, to get the block format people are accustomed to seeing.
  • The <p> tag generates a paragraph break. It is applied to a section of text that is a block of text separated from nearby blocks of text by a blank space and/or first-line indent.
  • The <pre> tag is used with preformatted text. It instructs the browser that the text is to appear exactly as written in the HTML file, including any spaces or blank lines. If you type five spaces inside <pre> tags, you get five spaces on the website.
  • The <&nbsp> tag creates a space that does not break into a new line. Two words that are separated by a non-breaking space always appear on the same line.
  • You can also add space around text using Cascading Style Sheets (CSS).

Practice using these simple tags, noting the outcome of each. Getting around the lack of an HTML space tag isn't complicated if you get to know these quick methods.