From c7ce627ca8da26cbc9cb6edc3355072562ce7c30 Mon Sep 17 00:00:00 2001 From: Martijn Cuppens Date: Sat, 4 Jan 2020 18:13:48 +0100 Subject: [PATCH] Remove redundant `overflow-wrap` property While `overflow-wrap` is the more recommanded option, `word-wrap` alone has a wider support. --- scss/_utilities.scss | 4 ++-- site/content/docs/4.3/utilities/text.md | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/scss/_utilities.scss b/scss/_utilities.scss index 32312daf98..60ac6dac27 100644 --- a/scss/_utilities.scss +++ b/scss/_utilities.scss @@ -433,8 +433,8 @@ $utilities: map-merge( class: font, values: italic normal ), - "overflow-wrap": ( - property: overflow-wrap word-wrap, // word-wrap for IE & < Edge 18 + "word-wrap": ( + property: word-wrap, class: text, values: (break: break-word) ), diff --git a/site/content/docs/4.3/utilities/text.md b/site/content/docs/4.3/utilities/text.md index 00057da259..d7a8e97b09 100644 --- a/site/content/docs/4.3/utilities/text.md +++ b/site/content/docs/4.3/utilities/text.md @@ -45,7 +45,7 @@ Prevent text from wrapping with a `.text-nowrap` class. ## Word break -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). +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. {{< example >}}

mmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmm