Em space ( ) and en space ( ) in HTML
An em space is as wide as the current font size and an en space is half that. Their named references are   and  , at U+2003 and U+2002.
At a glance
- Character
- (invisible, one em and one half em wide)
- Named entity
-    
- Decimal reference
-    
- Hex reference
-    
- Unicode code point
- U+2003, U+2002
- Unicode name
- EM SPACE, EN SPACE
- In the entity reference
- Not in the 152 entity list
In detail
These two are defined relative to the type size rather than to the font's own space character. An em space is exactly the width of the current font size, so at sixteen pixels it is sixteen pixels wide, and an en space is exactly half of that. They therefore scale with the text in a way that a pixel value in a stylesheet does not, which is the one real argument for using them.
The argument against is stronger in almost every case. Spacing that lives in the content cannot be changed by a stylesheet, does not respond to a responsive layout, and gets copied along with the text into contexts where it makes no sense. Padding, margin, gap and text-indent all express the same intent as style, where it can be adjusted.
Where they still earn a place is inside a string that has to carry its own spacing: a generated label, a plain text export, an email subject line, anywhere the text will end up somewhere with no stylesheet at all. There the em space is the only way to say that this gap is intentional and proportional.
Both are breakable, like the thin space, so neither should be used to hold two things together on a line. There is a whole family of fixed width spaces in the same Unicode block, from the three per em space down to the hair space, and none of them is in the entity reference tool's list, so they need numeric references.
Examples
<title>Reference HTML entities ToolBox</title>
<p>Chapter 4 The parser</p><p class="chapter"><span class="num">4</span>The parser</p>
.chapter .num { margin-inline-end: 0.5em; }Half an em of margin is the en space width, and a stylesheet can change it later.
Things that catch people out
- Both characters permit a line break, so they cannot be used to keep two items together. That is what the non-breaking space is for.
- Their width tracks the font size, so a heading and a paragraph containing the same markup will show different gaps. That is correct behaviour and it surprises people.
- Neither is in the entity reference tool's list, and the wider family of fixed width spaces has no named entities at all.
Try it: HTML Entity Reference
Search 152 entities across 9 categories, switch the copy format between the character, the name, the decimal form and the hex form, and copy in one click.
HTML Entity Reference
LOCAL · Browser-OnlySearchable reference of 150+ HTML entities with one-click copy in any format
152 entities across 9 categories
Commonly Used
→Arrows(13)
±Math(35)
$Currency(8)
…Punctuation(21)
©Symbols(24)
πGreek(30)
½Fractions(6)
●Geometric(7)
æLatin Special(8)
Click any entity card to copy it in your chosen format. All data is embedded in the page and works offline.
Related HTML entities
All html entities →Thin space ( ) in HTML
The thin space at U+2009, its named reference, its use as a digit group separator, and the narrow no-break space that stops a number splitting.
Non-breaking space ( ) in HTML
The no-break space at U+00A0, what it prevents beyond line breaking, why it defeats site search, and the CSS properties that do the job better.
Zero width space (U+200B) in HTML
The zero width space at U+200B, why it is not in the entity reference tool, how it lets long strings wrap, and the trouble an invisible character causes.
Ampersand (&) in HTML
The ampersand opens every character reference, so a bare & in markup is ambiguous. What & fixes, and the query string trap that quietly eats a parameter.
Less than sign (<) in HTML
A literal < starts a tag, so text containing it has to be written <. Where the parser recovers, where it does not, and why this is the core of escaping.
Greater than sign (>) in HTML
A lone > is legal in HTML text but not everywhere. The contexts that force >, the comment and CDATA rules, and why escapers emit it anyway.
Tools for this
- Unicode Character Finder Free online unicode character finder - search and copy special Unicode characters and symbols
- HTML Entity Reference Free online HTML entity reference - search and copy HTML entities with live preview