float-nowrap-hyphen-rewind-1-ref.html (920B)
1 <!DOCTYPE html> 2 <style> 3 #container { 4 font-family: monospace; 5 font-size: 20px; 6 hyphens: auto; 7 } 8 9 #container > div { 10 border: 1px solid blue; 11 } 12 13 #container > div > div { 14 border: 1px solid gray; 15 } 16 17 span.wrapper { 18 white-space: pre; 19 } 20 21 .float { 22 float: right; 23 margin-right: -100px; 24 } 25 </style> 26 <div id="container" lang="en-US"> 27 <div style="width: 23ch"> 28 <div> 29 pppp 30 comprehension<span class="wrapper"> ppp</span> 31 pppp 32 <span class="float">float</span> 33 </div> 34 <div> 35 pppp 36 comprehension<span class="wrapper">[ppp</span> 37 pppp 38 <span class="float">float</span> 39 </div> 40 <div> 41 pppp 42 pppp pppp XXX<span class="wrapper"> ppp</span> 43 pppp 44 <span class="float">float</span> 45 </div> 46 <div> 47 pppp 48 pppp pppp XXX<span class="wrapper">[ppp</span> 49 pppp 50 <span class="float">float</span> 51 </div> 52 </div> 53 </div>