Ellipsis (…) in HTML
The horizontal ellipsis is a single character that draws three evenly spaced dots. Its named reference is … and its code point is U+2026, which is not the same as typing three full stops.
At a glance
- Character
- …
- Named entity
- …
- Decimal reference
- …
- Hex reference
- …
- Unicode code point
- U+2026
- Unicode name
- HORIZONTAL ELLIPSIS
- In the entity reference
- Punctuation, and pinned in quick access
In detail
Three typed full stops and the single ellipsis character look similar and behave differently. The single character cannot be broken across a line, its dot spacing is designed by the type designer rather than by the width of a period glyph, and it counts as one character everywhere that character counts matter, which includes meta descriptions, tweet style limits and database column widths.
The three dot version can wrap, and when it does you get one dot stranded at the end of a line and two at the start of the next. That is the strongest practical argument for the single character in body text. If you prefer the wider spacing of three periods, the correct fix is three periods joined by non-breaking spaces, not three plain periods and hope.
Search is the counterargument. A user typing three periods into a site search will not match the single character unless your indexer normalises them, and the reverse is also true. If you mix both forms across a content set, you have made two strings that look identical to a reader and different to every machine that touches them.
None of this applies to truncation in the interface. The CSS text-overflow property draws its own ellipsis; there is no character in the document and nothing for a copy or a screen reader to pick up, which is precisely why a visually truncated label still needs the full text available in the accessible name or a title attribute.
Examples
<p>She paused… then carried on.</p>
<p>“It was, well… complicated.”</p>.title {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}The dots here are drawn by the browser. Copying the text still yields the full string.
Things that catch people out
- Truncating a string to a fixed length and appending the character can cut a multi byte sequence in half if the truncation counts bytes rather than characters. Count code points, or better, grapheme clusters.
- Word processors substitute the single character automatically. Content pasted from one will not match content typed by hand into a form, so a duplicate check that compares strings exactly will see two different titles.
- The character already ends a sentence visually but not grammatically. A full stop after it is correct in some style guides and looks like a typo in others, so decide once and write it down.
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 →Em dash (—) in HTML
The em dash at U+2014, its named, decimal and hex references, how it differs from the en dash and hyphen, and the practical reasons to prefer a comma.
Curly quotes: ‘ ’ “ and ”
The opening and closing single and double curly quotes, their entities and code points, when they help prose and when they break code and search.
Bullet (•) in HTML
The bullet at U+2022 with its entity forms, why a real list beats a typed bullet, and how to use it as a separator without confusing a screen reader.
Middle dot (·) in HTML
The interpunct at U+00B7, its entity forms, its use as a byline separator, its role in Catalan spelling, and how it differs from the bullet and dot operator.
Guillemets (« and ») in HTML
The double angle quotation marks at U+00AB and U+00BB, how their direction changes by language, the French spacing rule, and why they are poor UI chevrons.
Section sign (§) in HTML
The section sign at U+00A7 with its entity forms, how the doubled form marks a range of sections, and why it should never be separated from its number.
Tools for this
- HTML Entity Reference Free online HTML entity reference - search and copy HTML entities with live preview
- HTML Entity Encoder Free online HTML entity encoder - encode or decode HTML entities to prevent XSS and display issues