Skip to content

Commit c7ce627

Browse files
Remove redundant overflow-wrap property
While `overflow-wrap` is the more recommanded option, `word-wrap` alone has a wider support.
1 parent d5270cb commit c7ce627

File tree

2 files changed

+3
-3
lines changed

2 files changed

+3
-3
lines changed

scss/_utilities.scss

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -433,8 +433,8 @@ $utilities: map-merge(
433433
class: font,
434434
values: italic normal
435435
),
436-
"overflow-wrap": (
437-
property: overflow-wrap word-wrap, // word-wrap for IE & < Edge 18
436+
"word-wrap": (
437+
property: word-wrap,
438438
class: text,
439439
values: (break: break-word)
440440
),

site/content/docs/4.3/utilities/text.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -45,7 +45,7 @@ Prevent text from wrapping with a `.text-nowrap` class.
4545

4646
## Word break
4747

48-
Prevent long strings of text from breaking your components' layout by using `.text-break` to set `overflow-wrap: break-word` (and `word-wrap: break-word` for IE & Edge compatibility).
48+
Prevent long strings of text from breaking your components' layout by using `.text-break` to set `word-wrap: break-word`. We use `word-wrap` instead of the more common `overflow-wrap` for wider browser support.
4949

5050
{{< example >}}
5151
<p class="text-break">mmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmm</p>

0 commit comments

Comments
 (0)