top of page

How to insert spaces/tabs in text using HTML/CSS?

Updated: Mar 18, 2023


You can use the non-breaking space ( ) ( ) and ( ) character entity to insert a space in HTML. The non-breaking space is a special character that prevents the browser from breaking the space into two lines.


1. The   character entity is used to denote a non-breaking space which is a fixed space. This may be perceived as twice the space of a normal space. It is used to create a space in a line that cannot be broken by word wrap.


2. The   character entity is used to denote an ‘en’ space which means half point size of the current font. This may be perceived as twice the space of a normal space.


3. The   character entity is used to denote an ’em’ space which means equal to the point size of the current font. This may be perceived as four times the space of a normal space.


Syntax:

Regular space:  
Two spaces gap:  
Four spaces gap:  

Example:

<!DOCTYPE html>
<html>
<head>
    <title>
        How to insert spaces/tabs in text using HTML/CSS?
    </title>
</head>
<body>
    <h1 style="color: Blue">The Tech Platform</h1>
    <b>How to insert spaces/tabs in text using HTML/CSS?</b>
    <p>This is a &nbsp; regular space.</p>
    <p>This is a &ensp; two spaces gap.</p>
    <p>This is a &emsp; four spaces gap.</p>
</body>
</html>

Output:



The Tech Platform


0 comments
bottom of page