tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

multiline-shrink-to-fit-ref.html (2204B)

      1 <!DOCTYPE html>
      2 <html>
      3 <style>
      4 .testcase {
      5    float: left;
      6    background-color: #aaa;
      7 }
      8 
      9 .testcase > :nth-child(1) {
     10    background-color: lightblue;
     11 }
     12 .testcase > :nth-child(2) {
     13    background-color: lightgreen;
     14 }
     15 .testcase > :nth-child(3) {
     16    background-color: pink;
     17 }
     18 .testcase > :nth-child(4) {
     19    background-color: yellow;
     20 }
     21 
     22 table {
     23  border-spacing: 0;
     24  border-collapse: collapse;
     25 }
     26 
     27 td {
     28  padding: 0;
     29  width: 100px;
     30 }
     31 
     32 </style>
     33 <body>
     34 
     35 <div class="testcase" style="height: 60px; width: 100px">
     36  <div style="width: 100px; height: 20px"></div>
     37  <div style="width: 100px; height: 10px"></div>
     38  <div style="width: 100px; height: 10px"></div>
     39  <div style="width: 100px; height: 20px"></div>
     40 </div>
     41 <p style="clear:left">The grey background should be 100px wide.</p>
     42 
     43 <div class="testcase" style="height: 30px; width: 100px">
     44  <table>
     45    <td>
     46      <div style="width: 100px; height: 20px"></div>
     47      <div style="width: 100px; height: 10px; background-color: lightgreen"></div>
     48    </td>
     49    <td>
     50      <div style="width: 100px; height: 10px; background-color: pink"></div>
     51      <div style="width: 100px; height: 20px; background-color: yellow"></div>
     52    </td>
     53  </table>
     54 </div>
     55 <p style="clear:left">The grey background should be 100px wide.</p>
     56 
     57 <div style="width: 150px">
     58 <div class="testcase" style="height: 60px; width: 100px">
     59  <div style="width: 100px; height: 20px"></div>
     60  <div style="width: 100px; height: 10px"></div>
     61  <div style="width: 100px; height: 10px"></div>
     62  <div style="width: 100px; height: 20px"></div>
     63 </div>
     64 </div>
     65 <p style="clear:left">The grey background should be 100px wide.</p>
     66 
     67 <div style="width: 150px">
     68 <div class="testcase" style="height: 35px; width: 150px;">
     69  <table>
     70    <td>
     71      <div style="width: 100px; height: 20px"></div>
     72      <div style="width: 100px; height: 10px; background-color: lightgreen"></div>
     73    </td>
     74    <td>
     75      <div style="width: 100px; height: 10px; background-color: pink"></div>
     76      <div style="width: 100px; height: 20px; background-color: yellow"></div>
     77    </td>
     78  </table>
     79 </div>
     80 </div>
     81 <p style="clear:left">The grey background should be 150px wide and 5px should
     82 stick out the bottom.</p>
     83 
     84 </body>
     85 </html>