Dialtone

Word Break

Utilities for controlling the way words break within an element.

Classes

ClassOutput
.d-wb-normalword-break: normal !important;
.d-wb-break-allword-break: break-all !important;
.d-wb-keep-allword-break: keep-all !important;
.d-wb-unsetword-break: unset !important;

Normal

Use d-wb-normal to reset an element's line break rule.

<p class="d-wb-normal">...</p>

Break All

Use d-wb-break-all on an element to insert word breaks between any two characters (excluding Chinese, Japanese, or Korean text) to prevent text from overflowing.

<p class="d-wb-break-all">...</p>

Keep All

Use d-wb-keep-all on an element to not use word breaks for Chinese, Japanese, or Korean (CJK) text. Non-CJK text behavior is set to normal.

<p class="d-wb-keep-all">...</p>
Last Updated: