| <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> |
| <html> |
| |
| <head> |
| <style> |
| table |
| { |
| border-collapse: collapse; |
| color: white; |
| font: 1.25em/1 Ahem; |
| margin: auto auto 2em 2em; |
| } |
| |
| .blue {border: solid 1em blue;} |
| .yellow {border: solid 1em yellow;} |
| .orange {border: solid 1em orange;} |
| |
| table#reference > tbody {border: red none 0em;} |
| |
| td {padding: 0px;} |
| |
| img |
| { |
| height: 1em; |
| vertical-align: bottom; |
| /* |
| With 'vertical-align: bottom', swatch-[color] images "sit" |
| at the bottom of the cell's line box and not on its baseline |
| */ |
| width: 1em; |
| } |
| </style> |
| </head> |
| |
| <body> |
| <p>Test passes if both multi-colored rectangular structures are <strong>perfectly identical</strong>.</p> |
| |
| <table> |
| <tr><td class="blue">BLUE</td></tr> |
| <tr><td class="yellow">YELL</td></tr> |
| <tr><td class="orange">ORAN</td></tr> |
| </table> |
| |
| |
| <table id="reference"> |
| <tr> |
| <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> |
| </tr> |
| <tr> |
| <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> |
| </tr> |
| <tr> |
| <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> |
| </tr> |
| <tr> |
| <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> |
| </tr> |
| <tr> |
| <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> |
| </tr> |
| <tr> |
| <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> |
| </tr> |
| <tr> |
| <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> |
| </tr> |
| </table> |
| |
| </body> |
| </html> |
