Hyphens
Control hyphenation
Syntax
visual="hyphens:[value]"Values
| Value | CSS Output | Description |
|---|---|---|
none | hyphens: none | No hyphens |
manual | hyphens: manual | Manual hyphens |
auto | hyphens: auto | Auto hyphens |
Examples
html
<p visual="hyphens:auto">Automatic hyphenation</p>Preview
Hyphens
visual="hyphens:auto" - Control automatic hyphenation
none
manual
auto
View Code
html
<div layout="flex" space="g:medium p:medium" visual="bg:neutral-100 dark:bg:neutral-900 rounded:medium">
<div space="p:small" visual="bg:primary text:white rounded:small hyphens:none">none</div>
<div space="p:small" visual="bg:primary text:white rounded:small hyphens:manual">manual</div>
<div space="p:small" visual="bg:primary text:white rounded:small hyphens:auto">auto</div>
</div>