CSS hyphens attribute

Definition and Usage

The hyphens property defines whether hyphens are allowed to create more opportunities for automatic line breaks in a line of text.

Example

Set different hyphens:

div.a {
  -webkit-hyphens: none;
  -ms-hyphens: none;
  hyphens: none;
}
div.b {
  -webkit-hyphens: manual;
  -ms-hyphens: manual;
  hyphens: manual;
}
div.c {
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
}

Try It Yourself

CSS Syntax

hyphens: none|manual|auto|initial|inherit;

Property Value

Value Description
none Words without hyphens (no line breaks).
manual Default. Hyphens are only present at ‐ or ­ (if needed).
auto Inserts hyphens at the algorithmically determined position (if needed).
initial Sets this property to its default value. See: initial.
inherit Inherits this property from its parent element. See: inherit.

Technical Details

Default Value: manual
Inheritance: Yes
Animation Production: Not supported. See:Animation-related Properties.
Version: CSS3
JavaScript Syntax: object.style.hyphens="none"

Browser Support

The numbers in the table indicate the first browser version that fully supports this property.

Numbers with -webkit- or -ms- prefixes indicate the first version using the prefix.

Chrome IE / Edge Firefox Safari Opera
55.0 79.0
10.0 -ms-		 43.0 5.1 -webkit- 44.0