Fix long strings of text without spaces overflow the block

WordPress · Aug 25, 2021 · 690b83e · 690b83e
1 parent cfc5d8b
commit 690b83e
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 3 deletions.
diff --git a/packages/block-library/src/heading/style.scss b/packages/block-library/src/heading/style.scss
@@ -4,6 +4,9 @@ h3,
 h4,
 h5,
 h6 {
+	// Break long strings of text without spaces so they don't overflow the block.
+	overflow-wrap: break-word;
+
 	&.has-background {
 		padding: $block-bg-padding--v $block-bg-padding--h;
 	}

diff --git a/packages/block-library/src/list/style.scss b/packages/block-library/src/list/style.scss
@@ -1,4 +1,9 @@
-ol.has-background,
-ul.has-background {
-	padding: $block-bg-padding--v $block-bg-padding--h;
+ol,
+ul {
+	// Break long strings of text without spaces so they don't overflow the block.
+	overflow-wrap: break-word;
+
+	&.has-background {
+		padding: $block-bg-padding--v $block-bg-padding--h;
+	}
 }
diff --git a/packages/block-library/src/paragraph/style.scss b/packages/block-library/src/paragraph/style.scss
@@ -28,6 +28,11 @@
 	font-style: normal;
 }
 
+p {
+	// Break long strings of text without spaces so they don't overflow the block.
+	overflow-wrap: break-word;
+}
+
 // Prevent the dropcap from breaking out of the box when a background is applied.
 p.has-drop-cap.has-background {
 	overflow: hidden;