white-space-2.html (2340B)
1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <!-- Wrapping tests in table-cell to test min-width computation --> 5 <style> 6 div { font:16px sans-serif; border:1px solid black; } 7 .container { float:left; width:20%; border-color:cyan; } 8 p { width:0; } 9 b { font-weight:normal; background-color:yellow; } 10 .cell { display:table-cell; border:1px solid green; } 11 .nowrap { white-space:nowrap; } 12 .pre { white-space:pre; } 13 .prewrap { white-space:pre-wrap; } 14 </style> 15 </head> 16 <body> 17 18 <div> 19 <p><span class="cell"><b>Hello Kitty</b></span> 20 <p><span class="cell"><b>Hello<span class="pre"> </span>Kitty</b></span> 21 <p><span class="cell"><b>Hello<span class="nowrap"> </span>Kitty</b></span> 22 <p><span class="cell"><b>Hello<span class="prewrap"> </span>Kitty</b></span> 23 </div> 24 25 <div class="container"> 26 <p><span class="cell"><b>Hello <span>Kitty</span></b></span> 27 <p><span class="cell"><b>Hello<span class="pre"> </span> Kitty</b></span> 28 <p><span class="cell"><b>Hello<span class="nowrap"> </span> Kitty</b></span> 29 <p><span class="cell"><b>Hello<span class="prewrap"> </span> Kitty</b></span> 30 </div> 31 32 <div class="container"> 33 <p><span class="cell"><b>Hello <span class="pre"> </span>Kitty</b></span> 34 <p><span class="cell"><b>Hello<span class="pre"> </span><span class="pre"> </span>Kitty</b></span> 35 <p><span class="cell"><b>Hello<span class="nowrap"> </span><span class="pre"> </span>Kitty</b></span> 36 <p><span class="cell"><b>Hello<span class="prewrap"> </span><span class="pre"> </span>Kitty</b></span> 37 </div> 38 39 <div class="container"> 40 <p><span class="cell"><b>Hello <span class="nowrap"> </span>Kitty</b></span> 41 <p><span class="cell"><b>Hello<span class="pre"> </span><span class="nowrap"> </span>Kitty</b></span> 42 <p><span class="cell"><b>Hello<span class="nowrap"> </span><span class="nowrap"> </span>Kitty</b></span> 43 <p><span class="cell"><b>Hello<span class="prewrap"> </span><span class="nowrap"> </span>Kitty</b></span> 44 </div> 45 46 <div class="container"> 47 <p><span class="cell"><b>Hello <span class="prewrap"> </span>Kitty</b></span> 48 <p><span class="cell"><b>Hello<span class="pre"> </span><span class="prewrap"> </span>Kitty</b></span> 49 <p><span class="cell"><b>Hello<span class="nowrap"> </span><span class="prewrap"> </span>Kitty</b></span> 50 <p><span class="cell"><b>Hello<span class="prewrap"> </span><span class="prewrap"> </span>Kitty</b></span> 51 </div> 52 53 </body> 54 </html>