Typography
Utilities for controlling how words should be hyphenated.
Class | Styles |
---|---|
hyphens-none | hyphens: none; |
hyphens-manual | hyphens: manual; |
hyphens-auto | hyphens: auto; |
Use the hyphens-none
utility to prevent words from being hyphenated even if the line break suggestion ­
is used:
Use the hyphens-manual
utility to only set hyphenation points where the line break suggestion ­
is used:
This is the default browser behavior.
Use the hyphens-auto
utility to allow the browser to automatically choose hyphenation points based on the language:
The line break suggestion ­
will be preferred over automatic hyphenation points.
Prefix a hyphens
utility with a breakpoint variant like md:
to only apply the utility at medium screen sizes and above:
<p class="hyphens-none md:hyphens-auto ..."> <!-- ... --></p>
Learn more about using variants in the variants documentation.