add hyphenate-limit-chars:auto 3

u1ui · Jan 11, 2023 · 3153951 · 3153951
1 parent e533c0e
commit 3153951
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 2 deletions.
diff --git a/base.css b/base.css
@@ -10,7 +10,7 @@ html {
 	overflow-wrap:break-word;
 	-webkit-hyphens: auto;
 	hyphens: auto;
-	/* hyphenate-limit-chars:auto 4; todo: awaiting support (chrome 109)  */
+	hyphenate-limit-chars:auto 3; /* only chrome >= 109 */
 	tab-size: 4;
 	--line-height: calc(1em + .5rem);
 	-webkit-tap-highlight-color: transparent;

diff --git a/tests/test.html b/tests/test.html
@@ -272,7 +272,6 @@ <h6>Header level 6 Some more Text to test line-height Some more Text to test lin
     </li>
     <li>2.0 LI
   </ul>
-VeryLongTextShouldBreakVeryLongTextShouldBreakVeryLongTextShouldBreak
   <br>
   IMG too big scales down (also has margin:1rem):
   <br>
@@ -347,6 +346,18 @@ <h2>Inert-attribute</h2>
 
 </section>
 
+<section>
+  <h2>Hyphens</h2>
+
+  <div style="width:14em; border:1px solid red">This word shoud be hyphenated. Ok?</div><!-- chrome does not hyphenate the last word -->
+  <div style="width:6em; border:1px solid red">this not: table. (Chrome only)</div>
+  as its parts are to short (2 chars)
+
+  <h2>Break</h2>
+  VeryLongTextShouldBreakVeryLongTextShouldBreakVeryLongTextShouldBreak
+
+</section>
+
 
 <section>
   Smooth scrolling (on every element)