The hyphens
CSS property specifies how words should be hyphenated when text wraps across multiple lines. It can prevent hyphenation entirely, hyphenate at manually-specified points within the text, or let the browser automatically insert hyphens where appropriate.
Hyphenation rules are language-specific. In HTML, the language is determined by the lang
attribute, and browsers will hyphenate only if this attribute is present and the appropriate hyphenation dictionary is available. In XML, the xml:lang
attribute must be used.
Note: The rules defining how hyphenation is performed are not explicitly defined by the specification, so the exact hyphenation may vary from browser to browser.
Syntax
/* Keyword values */ hyphens: none; hyphens: manual; hyphens: auto; /* Global values */ hyphens: inherit; hyphens: initial; hyphens: unset;
The hyphens
property is specified as a single keyword value chosen from the list below.
Values
none
- Words are not broken at line breaks, even if characters inside the words suggest line break points. Lines will only wrap at whitespace.
manual
- Words are broken for line-wrapping only where characters inside the word suggest line break opportunities. See Suggesting line break opportunities below for details.
auto
- The browser is free to automatically break words at appropriate hyphenation points, following whatever rules it chooses. However, suggested line break opportunities (see Suggesting line break opportunities below) will override automatic break point selection when present.
Note: The auto
setting's behavior depends on the language being properly tagged to select the appropriate hyphenation rules. You must specify a language using the lang
HTML attribute to guarantee that automatic hyphenation is applied in that language.
Suggesting line break opportunities
There are two Unicode characters used to manually specify potential line break points within text:
- U+2010 (HYPHEN)
- The "hard" hyphen character indicates a visible line break opportunity. Even if the line is not actually broken at that point, the hyphen is still rendered.
- U+00AD (SHY)
- An invisible, "soft" hyphen. This character is not rendered visibly; instead, it marks a place where the browser should break the word if hyphenation is necessary. In HTML, use
­
to insert a soft hyphen.
When the HTML <wbr>
element leads to a line break, no hyphen is added.
Formal definition
Initial value | manual |
---|---|
Applies to | all elements |
Inherited | yes |
Computed value | as specified |
Animation type | discrete |
Formal syntax
none | manual | auto
Examples
Specifying text hyphenation
This example uses three classes, one for each possible configuration of the hyphens
property.
HTML
<dl> <dt><code>none</code>: no hyphen; overflow if needed</dt> <dd lang="en" class="none">An extreme­ly long English word</dd> <dt><code>manual</code>: hyphen only at &hyphen; or &shy; (if needed)</dt> <dd lang="en" class="manual">An extreme­ly long English word</dd> <dt><code>auto</code>: hyphens where the algorithm decides (if needed)</dt> <dd lang="en" class="auto">An extreme­ly long English word</dd> </dl>
CSS
dd { width: 55px; border: 1px solid black; } dd.none { -webkit-hyphens: none; -ms-hyphens: none; hyphens: none; } dd.manual { -webkit-hyphens: manual; -ms-hyphens: manual; hyphens: manual; } dd.auto { -webkit-hyphens: auto; -ms-hyphens: auto; hyphens: auto; }
Result
Specifications
Specification | Status | Comment |
---|---|---|
CSS Text Module Level 3 The definition of 'hyphens' in that specification. |
Working Draft | Initial definition |
Browser compatibility
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
hyphens | Chrome
Partial support
55
| Edge
Partial support
12
| Firefox
Full support
43
| IE
Partial support
10
| Opera
Partial support
44
| Safari
Full support
5.1
| WebView Android
Full support
55
| Chrome Android
Full support
55
| Firefox Android
Full support
43
| Opera Android Full support 43 | Safari iOS
Full support
4.2
| Samsung Internet Android
Full support
6.0
|
Hyphenation dictionary for Afrikaans (af, af-*) | Chrome No support No | Edge No support No | Firefox Full support 8 | IE No support No | Opera No support No | Safari No support No | WebView Android No support No | Chrome Android No support No | Firefox Android Full support 8 | Opera Android No support No | Safari iOS No support No | Samsung Internet Android No support No |
Hyphenation dictionary for Bosnian, Serbian, and Serbo-Croatian (sh, sh-*, sr, sr-*, bs, bs-*) | Chrome No support No | Edge No support No | Firefox Full support 8 | IE No support No | Opera No support No | Safari No support No | WebView Android No support No | Chrome Android No support No | Firefox Android Full support 8 | Opera Android No support No | Safari iOS No support No | Samsung Internet Android No support No |
Hyphenation dictionary for Bulgarian (bg, bg-*) | Chrome No support No | Edge No support No | Firefox Full support 8 | IE No support No | Opera No support No | Safari No support No | WebView Android No support No | Chrome Android No support No | Firefox Android Full support 8 | Opera Android No support No | Safari iOS No support No | Samsung Internet Android No support No |
Hyphenation dictionary for Catalan (ca, ca-*) | Chrome No support No | Edge No support No | Firefox Full support 8 | IE No support No | Opera No support No | Safari Full support 5.1 | WebView Android No support No | Chrome Android No support No | Firefox Android Full support 8 | Opera Android No support No | Safari iOS Full support 5 | Samsung Internet Android No support No |
Hyphenation dictionary for Croatian (hr, hr-*) | Chrome No support No | Edge No support No | Firefox Full support 8 | IE No support No | Opera No support No | Safari Full support 9.1 | WebView Android No support No | Chrome Android No support No | Firefox Android Full support 8 | Opera Android No support No | Safari iOS Full support 9.3 | Samsung Internet Android No support No |
Hyphenation dictionary for Czech (cs, cs-*) | Chrome No support No | Edge No support No | Firefox No support No | IE No support No | Opera No support No | Safari Full support 9.1 | WebView Android No support No | Chrome Android No support No | Firefox Android No support No | Opera Android No support No | Safari iOS Full support 9.3 | Samsung Internet Android No support No |
Hyphenation dictionary for Danish (da, da-*) | Chrome No support No | Edge No support No | Firefox Full support 8 | IE No support No | Opera No support No | Safari Full support 5.1 | WebView Android No support No | Chrome Android No support No | Firefox Android Full support 8 | Opera Android No support No | Safari iOS Full support 5 | Samsung Internet Android No support No |
Hyphenation dictionary for Dutch (nl, nl-*) | Chrome No support No | Edge No support No | Firefox Full support 8 | IE No support No | Opera No support No | Safari Full support 5.1 | WebView Android No support No | Chrome Android No support No | Firefox Android Full support 8 | Opera Android No support No | Safari iOS Full support 5 | Samsung Internet Android No support No |
Hyphenation dictionary for English (en, en-*) | Chrome Full support 55 | Edge Full support 12 | Firefox
Full support
6
| IE Full support 10 | Opera Full support 44 | Safari
Full support
5.1
| WebView Android Full support 55 | Chrome Android Full support 55 | Firefox Android
Full support
6
| Opera Android Full support 43 | Safari iOS
Full support
6
| Samsung Internet Android Full support 6.0 |
Hyphenation dictionary for Esperanto (eo, eo-*) | Chrome No support No | Edge No support No | Firefox Full support 8 | IE No support No | Opera No support No | Safari No support No | WebView Android No support No | Chrome Android No support No | Firefox Android Full support 8 | Opera Android No support No | Safari iOS No support No | Samsung Internet Android No support No |
Hyphenation dictionary for Estonian (et, et-*) | Chrome No support No | Edge No support No | Firefox Full support 8 | IE No support No | Opera No support No | Safari No support No | WebView Android No support No | Chrome Android No support No | Firefox Android Full support 8 | Opera Android No support No | Safari iOS No support No | Samsung Internet Android No support No |
Hyphenation dictionary for Finnish (fi, fi-*) | Chrome No support No | Edge No support No | Firefox Full support 8 | IE No support No | Opera No support No | Safari Full support 9.1 | WebView Android No support No | Chrome Android No support No | Firefox Android Full support 8 | Opera Android No support No | Safari iOS Full support 9.3 | Samsung Internet Android No support No |
Hyphenation dictionary for French (fr, fr-*) | Chrome No support No | Edge No support No | Firefox Full support 8 | IE No support No | Opera No support No | Safari Full support 5.1 | WebView Android No support No | Chrome Android No support No | Firefox Android Full support 8 | Opera Android No support No | Safari iOS Full support 5 | Samsung Internet Android No support No |
Hyphenation dictionary for Galician (gl, gl-*) | Chrome No support No | Edge No support No | Firefox Full support 9 | IE No support No | Opera No support No | Safari No support No | WebView Android No support No | Chrome Android No support No | Firefox Android Full support 9 | Opera Android No support No | Safari iOS No support No | Samsung Internet Android No support No |
Hyphenation dictionary for German, Reformed Orthography of 1996 (de, de-1996, de-DE, de-AT, de-*) | Chrome No support No | Edge No support No | Firefox Full support 8 | IE No support No | Opera No support No | Safari Full support 5.1 | WebView Android No support No | Chrome Android No support No | Firefox Android Full support 8 | Opera Android No support No | Safari iOS Full support 5 | Samsung Internet Android No support No |
Hyphenation dictionary for German, Swiss Orthography (de-CH, de-CH-*) | Chrome No support No | Edge No support No | Firefox Full support 8 | IE No support No | Opera No support No | Safari No support No | WebView Android No support No | Chrome Android No support No | Firefox Android Full support 8 | Opera Android No support No | Safari iOS No support No | Samsung Internet Android No support No |
Hyphenation dictionary for German, Traditional Orthography of 1901 (de-1901, de-AT-1901, de-DE-1901) | Chrome No support No | Edge No support No | Firefox Full support 8 | IE No support No | Opera No support No | Safari No support No | WebView Android No support No | Chrome Android No support No | Firefox Android Full support 8 | Opera Android No support No | Safari iOS No support No | Samsung Internet Android No support No |
Hyphenation dictionary for Hungarian (hu, hu-*) | Chrome No support No | Edge No support No | Firefox Full support 9 | IE No support No | Opera No support No | Safari Full support 9.1 | WebView Android No support No | Chrome Android No support No | Firefox Android Full support 9 | Opera Android No support No | Safari iOS Full support 9.3 | Samsung Internet Android No support No |
Hyphenation dictionary for Icelandic (is, is-*) | Chrome No support No | Edge No support No | Firefox Full support 8 | IE No support No | Opera No support No | Safari No support No | WebView Android No support No | Chrome Android No support No | Firefox Android Full support 8 | Opera Android No support No | Safari iOS No support No | Samsung Internet Android No support No |
Hyphenation dictionary for Interlingua (ia, ia-*) | Chrome No support No | Edge No support No | Firefox Full support 8 | IE No support No | Opera No support No | Safari No support No | WebView Android No support No | Chrome Android No support No | Firefox Android Full support 8 | Opera Android No support No | Safari iOS No support No | Samsung Internet Android No support No |
Hyphenation dictionary for Italian (it, it-*) | Chrome No support No | Edge No support No | Firefox Full support 9 | IE No support No | Opera No support No | Safari Full support 5.1 | WebView Android No support No | Chrome Android No support No | Firefox Android Full support 9 | Opera Android No support No | Safari iOS Full support 5 | Samsung Internet Android No support No |
Hyphenation dictionary for Kurmanji (kmr, kmr-*) | Chrome No support No | Edge No support No | Firefox Full support 8 | IE No support No | Opera No support No | Safari No support No | WebView Android No support No | Chrome Android No support No | Firefox Android Full support 8 | Opera Android No support No | Safari iOS No support No | Samsung Internet Android No support No |
Hyphenation dictionary for Latin (la, la-*) | Chrome No support No | Edge No support No | Firefox Full support 8 | IE No support No | Opera No support No | Safari No support No | WebView Android No support No | Chrome Android No support No | Firefox Android Full support 8 | Opera Android No support No | Safari iOS No support No | Samsung Internet Android No support No |
Hyphenation dictionary for Lithuanian (lt, lt-*) | Chrome No support No | Edge No support No | Firefox Full support 8 | IE No support No | Opera No support No | Safari No support No | WebView Android No support No | Chrome Android No support No | Firefox Android Full support 8 | Opera Android No support No | Safari iOS No support No | Samsung Internet Android No support No |
Hyphenation dictionary for Mongolian (mn, mn-*) | Chrome No support No | Edge No support No | Firefox Full support 8 | IE No support No | Opera No support No | Safari No support No | WebView Android No support No | Chrome Android No support No | Firefox Android Full support 8 | Opera Android No support No | Safari iOS No support No | Samsung Internet Android No support No |
Hyphenation dictionary for Norwegian (Nynorsk) (nn, nn-*) | Chrome No support No | Edge No support No | Firefox Full support 8 | IE No support No | Opera No support No | Safari No support No | WebView Android No support No | Chrome Android No support No | Firefox Android Full support 8 | Opera Android No support No | Safari iOS Full support 5 | Samsung Internet Android No support No |
Hyphenation dictionary for Norwegian (Bokmål) (no, no-*, nb, nb-*) | Chrome No support No | Edge No support No | Firefox Full support 8 | IE No support No | Opera No support No | Safari Full support 5.1 | WebView Android No support No | Chrome Android No support No | Firefox Android Full support 8 | Opera Android No support No | Safari iOS Full support 5 | Samsung Internet Android No support No |
Hyphenation dictionary for Polish (pl, pl-*) | Chrome No support No | Edge No support No | Firefox Full support 31 | IE No support No | Opera No support No | Safari Full support 9.1 | WebView Android No support No | Chrome Android No support No | Firefox Android Full support 31 | Opera Android No support No | Safari iOS Full support 9.3 | Samsung Internet Android No support No |
Hyphenation dictionary for Portuguese (pt, pt-*) | Chrome No support No | Edge No support No | Firefox Full support 8 | IE No support No | Opera No support No | Safari Full support 9.1 | WebView Android No support No | Chrome Android No support No | Firefox Android Full support 8 | Opera Android No support No | Safari iOS Full support 9.3 | Samsung Internet Android No support No |
Hyphenation dictionary for Brazilian Portuguese (pt-BR) | Chrome No support No | Edge No support No | Firefox
Full support
8
| IE No support No | Opera No support No | Safari No support No | WebView Android No support No | Chrome Android No support No | Firefox Android
Full support
8
| Opera Android No support No | Safari iOS No support No | Samsung Internet Android No support No |
Hyphenation dictionary for Russian (ru, ru-*) | Chrome No support No | Edge No support No | Firefox Full support 8 | IE No support No | Opera No support No | Safari Full support 5.1 | WebView Android No support No | Chrome Android No support No | Firefox Android Full support 8 | Opera Android No support No | Safari iOS Full support 5 | Samsung Internet Android No support No |
Hyphenation dictionary for Slovenian (sl, sl-*) | Chrome No support No | Edge No support No | Firefox Full support 8 | IE No support No | Opera No support No | Safari No support No | WebView Android No support No | Chrome Android No support No | Firefox Android Full support 8 | Opera Android No support No | Safari iOS No support No | Samsung Internet Android No support No |
Hyphenation dictionary for Spanish (es, es-*) | Chrome No support No | Edge No support No | Firefox Full support 8 | IE No support No | Opera No support No | Safari Full support 5.1 | WebView Android No support No | Chrome Android No support No | Firefox Android Full support 8 | Opera Android No support No | Safari iOS Full support 5 | Samsung Internet Android No support No |
Hyphenation dictionary for Swedish (sv, sv-*) | Chrome No support No | Edge No support No | Firefox Full support 8 | IE No support No | Opera No support No | Safari Full support 5.1 | WebView Android No support No | Chrome Android No support No | Firefox Android Full support 8 | Opera Android No support No | Safari iOS Full support 5 | Samsung Internet Android No support No |
Hyphenation dictionary for Turkish (tr, tr-*) | Chrome No support No | Edge No support No | Firefox Full support 9 | IE No support No | Opera No support No | Safari Full support 5.1 | WebView Android No support No | Chrome Android No support No | Firefox Android Full support 9 | Opera Android No support No | Safari iOS Full support 5 | Samsung Internet Android No support No |
Hyphenation dictionary for Ukrainian (uk, uk-*) | Chrome No support No | Edge No support No | Firefox Full support 9 | IE No support No | Opera No support No | Safari Full support 9.1 | WebView Android No support No | Chrome Android No support No | Firefox Android Full support 9 | Opera Android No support No | Safari iOS Full support 9.3 | Samsung Internet Android No support No |
Hyphenation dictionary for Upper Sorbian (hsb, hsb-*) | Chrome No support No | Edge No support No | Firefox Full support 8 | IE No support No | Opera No support No | Safari No support No | WebView Android No support No | Chrome Android No support No | Firefox Android Full support 8 | Opera Android No support No | Safari iOS No support No | Samsung Internet Android No support No |
Hyphenation dictionary for Welsh (cy, cy-*) | Chrome No support No | Edge No support No | Firefox Full support 8 | IE No support No | Opera No support No | Safari No support No | WebView Android No support No | Chrome Android No support No | Firefox Android Full support 8 | Opera Android No support No | Safari iOS No support No | Samsung Internet Android No support No |
Legend
- Full support
- Full support
- Partial support
- Partial support
- No support
- No support
- See implementation notes.
- See implementation notes.
- Requires a vendor prefix or different name for use.
- Requires a vendor prefix or different name for use.
See also
content
overflow-wrap
(formerlyword-wrap
)word-break