third_party/WebKit/LayoutTests/css2.1/20110323/border-conflict-element-021a-expected.html

   1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
   2 <html>
   3
   4  <head>
   5   <style>
   6   table
   7   {
   8     border-collapse: collapse;
   9     color: white;
  10     font: 1.25em/1 Ahem;
  11     margin: auto auto 2em 2em;
  12   }
  13
  14   .blue {border: solid 1em blue;}
  15   .yellow {border: solid 1em yellow;}
  16   .orange {border: solid 1em orange;}
  17
  18   table#reference > tbody {border: red none 0em;}
  19
  20   td {padding: 0px;}
  21
  22   img
  23   {
  24   height: 1em;
  25   vertical-align: bottom;
  26   /*
  27   With 'vertical-align: bottom', swatch-[color] images "sit"
  28   at the bottom of the cell's line box and not on its baseline
  29   */
  30   width: 1em;
  31   }
  32   </style>
  33  </head>
  34
  35  <body>
  36   <p>Test passes if both multi-colored rectangular structures are <strong>perfectly identical</strong>.</p>
  37
  38   <table>
  39     <tr><td class="blue">BLUE</td></tr>
  40         <tr><td class="yellow">YELL</td></tr>
  41     <tr><td class="orange">ORAN</td></tr>
  42   </table>
  43
  44
  45   <table id="reference">
  46     <tr>
  47       <td><img src="support/swatch-blue.png"><img src="support/swatch-blue.png"><img src="support/swatch-blue.png"><img src="support/swatch-blue.png"><img src="support/swatch-blue.png"><img src="support/swatch-blue.png"></td>
  48     </tr>
  49     <tr>
  50       <td><img src="support/swatch-blue.png"><img src="support/swatch-white.png"><img src="support/swatch-white.png"><img src="support/swatch-white.png"><img src="support/swatch-white.png"><img src="support/swatch-blue.png"></td>
  51     </tr>
  52     <tr>
  53       <td><img src="support/swatch-blue.png"><img src="support/swatch-blue.png"><img src="support/swatch-blue.png"><img src="support/swatch-blue.png"><img src="support/swatch-blue.png"><img src="support/swatch-blue.png"></td>
  54     </tr>
  55     <tr>
  56       <td><img src="support/swatch-yellow.png"><img src="support/swatch-white.png"><img src="support/swatch-white.png"><img src="support/swatch-white.png"><img src="support/swatch-white.png"><img src="support/swatch-yellow.png"></td>
  57     </tr>
  58     <tr>
  59       <td><img src="support/swatch-yellow.png"><img src="support/swatch-yellow.png"><img src="support/swatch-yellow.png"><img src="support/swatch-yellow.png"><img src="support/swatch-yellow.png"><img src="support/swatch-yellow.png"></td>
  60     </tr>
  61     <tr>
  62       <td><img src="support/swatch-orange.png"><img src="support/swatch-white.png"><img src="support/swatch-white.png"><img src="support/swatch-white.png"><img src="support/swatch-white.png"><img src="support/swatch-orange.png"></td>
  63     </tr>
  64     <tr>
  65       <td><img src="support/swatch-orange.png"><img src="support/swatch-orange.png"><img src="support/swatch-orange.png"><img src="support/swatch-orange.png"><img src="support/swatch-orange.png"><img src="support/swatch-orange.png"></td>
  66     </tr>
  67   </table>
  68
  69  </body>
  70 </html>