OLD | NEW |
1 <html> | 1 <!DOCTYPE html> |
2 <head> | |
3 <style> | 2 <style> |
4 .columns { -moz-column-count:2; -webkit-column-count:2; column-count:2; column-f
ill:auto; border:2px solid black; height:300px } | 3 .columns { -webkit-column-count:2; -webkit-column-gap:20px; column-fill:auto
; border:2px solid black; width:520px; height:300px } |
5 .block { height:200px; background-color:purple; } | 4 .block { height:200px; } |
6 </style> | 5 </style> |
7 </head> | 6 <p>The four rectangles below should both be at the top of their columns. If one
is lower than the |
8 <body> | 7 other, the test has failed. The pattern in each column should be the same (o
range/yellow).</p> |
9 The four rectangles below should both be at the top of their columns. If one is
lower than the other, than the test has failed. The pattern in each | |
10 column should be the same (orange/yellow). | |
11 <div class="columns"> | 8 <div class="columns"> |
12 <table cellpadding=0 cellspacing=0 border=0 width=100%> | 9 <table cellpadding=0 cellspacing=0 border=0 width="100%"> |
13 <tr><td width=50%> | 10 <tr> |
14 <div class="block" style="margin-bottom:200px; background-color:orange"></div> | 11 <td width="50%"> |
15 <div class="block" style="background-color:orange"></div> | 12 <div class="block" style="margin-bottom:200px; background-color:
orange"></div> |
16 </td> | 13 <div class="block" style="background-color:orange"></div> |
17 <td width=50%> | 14 </td> |
18 <div class="block" style="margin-bottom:200px; background-color:yellow"></div> | 15 <td width="50%"> |
19 <div class="block" style="background-color:yellow"></div> | 16 <div class="block" style="margin-bottom:200px; background-color:
yellow"></div> |
20 </td></tr> | 17 <div class="block" style="background-color:yellow"></div> |
21 </table> | 18 </td> |
| 19 </tr> |
| 20 </table> |
22 </div> | 21 </div> |
OLD | NEW |