CSS hyphens Property


The hyphensCSS property is used to control the hyphenation of text within a webpage. By default, browsers automatically hyphenate long words to improve text layout and readability. However, the hyphens property allows web developers to have more control over this behavior. It has three possible values: "none" (which disables hyphenation altogether), "manual" (which suggests breakpoints where hyphens should occur using the ­ HTML entity), and "auto" (which lets the browser automatically determine suitable hyphenation points based on language-specific rules and user preferences). This property is particularly useful for fine-tuning the appearance of text in multi-language websites and improving the overall aesthetics of web typography.

Initial value
Applies to
All elements
Computed value
Specified value
JavaScript syntax

Interactive Demo

An extra­ordinarily long English word!


hyphens: none | manual | auto 


  • noneWords are not hyphenated, even if characters inside the word explicitly define hyphenation opportunities.
  • manualWords are only hyphenated where there are characters inside the word that explicitly suggest hyphenation opportunities.
  • autoThe browser is free to automatically break words at appropriate hyphenation points, following whatever rules it chooses to use.


<dt><code>none</code>: no hyphen; overflow if needed</dt>
<dd lang="en" class="none">An extreme&shy;ly long English word</dd>
<code>manual</code>: hyphen only at &amp;hyphen; or &amp;shy; (if needed)
<dd lang="en" class="manual">An extreme&shy;ly long English word</dd>
<dt><code>auto</code>: hyphens where the algorithm decides (if needed)</dt>
<dd lang="en" class="auto">An extreme&shy;ly long English word</dd>
dd {
  width: 55px;
  border: 1px solid black;
dd.none {
  hyphens: none;
dd.manual {
  hyphens: manual;
dd.auto {
  hyphens: auto;

Browser Support

The following table will show you the current browser support for the CSS hyphens property.

Edge Chrome Firefox Opera Safari
Tablets / Mobile
Chrome Firefox Opera Safari Samsung Webview

Last updated by CSSPortal on: 2nd January 2024