White Spaces in HTML

What are White Spaces?

In a normal document, like a *.doc document (MS word document) or any other, you need to insert some invisible characters like space, tab (a combination of 8 spaces), new line, section break and page break etc to improve readability of the reader and the look of the document. These invisible characters are known as white spaces.

White Spaces in HTML

Like any other document when we create any webpage (HTML document) we need to insert some white spaces to improve the readability of the users and the look of the document as you are observing in this webpage. In advanced word processors you can insert white spaces in your document quite easily but in case of an HTML document, except the single space white space, you can’t include other white spaces directly in your webpage. For example, you can’t include a:

• Newline directly in your webpage by just pressing the Enter Key.
• Tab directly in your webpage by just pressing the tab key.

There are different and special words, provided by the HTML, used to insert such white spaces, which cannot be inserted directly using standard keyboards, in a webpage. Here is some explanation of how to insert different white spaces in a webpage:

Inserting more than one spaces in an HTML Document

A single space can easily be inserted in an HTML document as in any word processor. But, what you’ll do if you want to add more than one single space consecutively in your HTML document as if you’ll insert many spaces in your HTML document, while writing HTML code, only one space will be rendered by the web browser and other spaces will be ignored and not shown. For this purpose you need to do something special and HTML provides us a way to insert many single spaces in your webpage. You need to include &nbps at the point where you want to enter spaces in your webpage.

Exemplary Code:

<b>I've &nbsp &nbsp included &nbsp &nbsp  two &nbsp &nbsp  spaces &nbsp &nbsp  after &nbsp &nbsp each &nbsp &nbsp word! </b> </br<

Example Result:

I've     included     two     spaces     after     each     word!

Insert Tab in an HTML Document

Tabs are used to enter a gap of eight spaces between a word and its explanation. It is useful to align your document text. Unfortunately HTML doesn’t provide us the facility to insert a tab in your webpage. If you want to enter a tab in a webpage you can use &nbsp 8 times.

Exemplary Code:

<b>Name: &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp M.Khuram</b></br>
<b>E-Mail: &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp m.khuramj@yahoo.com</b> </br>

Example Result:

Name:                 M.Khuram
E-Mail:                 m.khuramj@yahoo.com

But it's better to use tables for such type of alignment of text.

Insert a New Line in an HTML Document

When you are working with text you need to end and start lines and paragraphs. For this purpose we need to enter a new line in a document. HTML provides us a tag to insert a newline in your webpage, you need to include </br>, <br></br> or <br /> tag at the point where you want to include a new line on your webpage.

Exemplary Code:

<b>This is an exemplary sentence and at the end of this sentence we’ll start our new line!</b></br></br>
<b>This is also an exemplary sentence which is written after a <em>line break</em> included in this<em>webpage.</em>

Example Result:

This is an exemplary sentence and at the end of this sentence we’ll start our new line!

This is also an exemplary sentence which is written after a line break included in this webpage.