hyphens

Summary

Specifies whether or not words in a sentence can be split by the use of a manual or automatic hyphenation mechanism.

Overview table

Initial value

manual

Applies to

All elements

Inherited

Yes

Media

visual

Computed value

specified value

Animatable

No

CSS Object Model Property
:

Percentages

N/A

Syntax

• hyphens: auto
• hyphens: manual
• hyphens: none

Values

none

Indicates that all word breaking is suppressed, even when explicitly specified with soft hyphens.

manual

Indicates that word breaking is allowed only where word breaking opportunities are suggested. These suggestions may come in the form of soft hyphens or hard hyphens. Soft hyphens (Unicode U+00AD, HTML ­) can be inserted on the desired place.

auto

Indicates that, in addition to suggested word breaking opportunities, word breaking opportunities are allowed where determined by a hyphenation resource (dictionary). Soft hyphens take priority over other hyphenation opportunities, but are still subject to the hyphenation controlled properties. By providing a language for the text (via the HTML lang attribute for example), a User Agent can determine the correct place to break a word.

Examples

Sets the hyphens property different on each of the paragraph elements.

p:nth-child(1) {
  hyphens: none;
}

p:nth-child(2) {
  hyphens: manual;
}

p:nth-child(3) {
  hyphens: auto;
}

View live example

Usage

 When hyphenation is not pre-set in a document, the default value for the hyphens property might not suit all cases. In cases where the language is properly set in the document, the hyphenation dictionaries provided in user agents can be able to break up words on the best possible place for each line.

The overall effect is that sentences run along almost the complete width of the box, and therefor can be slightly less high as end result.

Notes

Note that not all languages are supported by browsers which support the value auto for this property.

Syntax

hyphens: none | manual | auto

Related specifications

CSS Text Module Level 3

W3C Last Call Working Draft

See also

Related articles

Text

• block-progression

• font-language-override

• font-size

• hyphenate-limit-chars

• hyphenate-limit-lines

• hyphenate-limit-zone

• hyphens

• ime-mode

• layout-grid

• layout-grid-char

• layout-grid-line

• layout-grid-mode

• layout-grid-type

• letter-spacing

• text-overflow-ellipsis

• text-overflow-mode

• text-rendering

• user-modify

• Text

• size

• b

• b

• br

• br

• caption

• cite

• code

• del

• dfn

• em

• font

• hr

• i

• ins

• kbd

• mark

• samp

• strong

• Achieving typographic effects with the canvas tag

Related pages

• CSSStyleDeclarationCSSStyleDeclaration

Attributions

• Mozilla Developer Network : Article

• Microsoft Developer Network: [Windows Internet Explorer API reference Article]