hyphens-vs-float-clearance-001.html (937B)
1 <!DOCTYPE html> 2 <title>CSS Text Test: soft-hyphen and float clearance</title> 3 <link rel="match" href="reference/hyphens-vs-float-clearance-001-ref.html"> 4 <link rel="help" href="https://drafts.csswg.org/css-text-3/#hyphens-property"> 5 <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1902974"> 6 <link rel="author" href="mailto:jkew@mozilla.com"> 7 <style> 8 .outer { 9 font: 16px/1.4 monospace; 10 width: 6ch; 11 border: 1px solid gray; 12 float: left; 13 margin: 10px; 14 hyphens: auto; 15 } 16 .float { 17 float: right; 18 width: 2ch; 19 background: lightblue; 20 } 21 .h1 { 22 height: 1em; 23 } 24 .h2 { 25 height: 2em; 26 } 27 .h3 { 28 height: 3em; 29 } 30 .h4 { 31 height: 4em; 32 } 33 </style> 34 <body lang="en"> 35 <div class="outer"><div class="float h1"></div>hyphenate!</div> 36 <div class="outer"><div class="float h2"></div>hyphenate!</div> 37 <div class="outer"><div class="float h3"></div>hyphenate!</div> 38 <div class="outer"><div class="float h4"></div>hyphenate!</div>