| OLD | NEW |
| 1 <html> | 1 <html> |
| 2 <head> | 2 <head> |
| 3 <style> | 3 <style> |
| 4 .columns { -webkit-column-count:2; -moz-column-count: 2; column-count: 2; border
:2px solid black; height:300px } | 4 .columns { -moz-column-count:2; -webkit-column-count:2; column-count:2; column-f
ill:auto; border:2px solid black; height:300px } |
| 5 .block { height:200px; background-color:purple; } | 5 .block { height:200px; background-color:purple; } |
| 6 </style> | 6 </style> |
| 7 </head> | 7 </head> |
| 8 <body> | 8 <body> |
| 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 | 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). | 10 column should be the same (orange/yellow). |
| 11 <div class="columns"> | 11 <div class="columns"> |
| 12 <table cellpadding=0 cellspacing=0 border=0 width=100%> | 12 <table cellpadding=0 cellspacing=0 border=0 width=100%> |
| 13 <tr><td width=50%> | 13 <tr><td width=50%> |
| 14 <div class="block" style="margin-bottom:200px; background-color:orange"></div> | 14 <div class="block" style="margin-bottom:200px; background-color:orange"></div> |
| 15 <div class="block" style="background-color:orange"></div> | 15 <div class="block" style="background-color:orange"></div> |
| 16 </td> | 16 </td> |
| 17 <td width=50%> | 17 <td width=50%> |
| 18 <div class="block" style="margin-bottom:200px; background-color:yellow"></div> | 18 <div class="block" style="margin-bottom:200px; background-color:yellow"></div> |
| 19 <div class="block" style="background-color:yellow"></div> | 19 <div class="block" style="background-color:yellow"></div> |
| 20 </td></tr> | 20 </td></tr> |
| 21 </table> | 21 </table> |
| 22 </div> | 22 </div> |
| OLD | NEW |