OLD | NEW |
| 1 <!DOCTYPE html> |
| 2 <style> |
| 3 .columns { |
| 4 -webkit-column-count: 2; |
| 5 -webkit-column-gap: 0px; |
| 6 column-fill: auto; |
| 7 height: 300px; |
| 8 border: 2px solid black; |
| 9 line-height: 20px; |
| 10 } |
| 11 .dashed { |
| 12 border: 10px dashed maroon; |
| 13 } |
| 14 img { |
| 15 float: right; |
| 16 width: 100px; |
| 17 height: 200px; |
| 18 background-color: #cccccc; |
| 19 } |
| 20 </style> |
1 <p>This test is ensuring we don't grow the height of a block improperly when a f
loat has no line association (e.g., when it's at the end of a | 21 <p>This test is ensuring we don't grow the height of a block improperly when a f
loat has no line association (e.g., when it's at the end of a |
2 block). The complete dashed border should be in the first column, with none of i
t appearing in the second column.</p> | 22 block). The complete dashed border should be in the first column, with none of i
t appearing in the second column.</p> |
3 | 23 <div class="columns"> |
4 <div style="-moz-column-width:300px; -webkit-column-width:300px; column-width:30
0px; column-fill:auto; height:400px"> | 24 <div class="dashed"> |
5 <div style="border:10px dashed maroon"> | 25 This is some text.<br>This is some text.<br>This is some text.<br> |
6 This is some text.<br> | 26 This is some text.<br>This is some text.<br>This is some text.<br> |
7 This is some text.<br>This is some text.<br>This is some text.<br>This is some t
ext.<br>This is some text.<br>This is some text.<br> | 27 This is some text.<br>This is some text.<br>This is some text.<br> |
8 This is some text.<br>This is some text.<br>This is some text.<br>This is some t
ext.<br> | 28 This is some text.<br>This is some text.<br>This is some text.<br> |
9 This is some text.<br> | 29 <img> |
10 <img style="float:right;width:100px;height:200px;background-color:#cccccc"> | 30 </div> |
11 </div> | 31 </div> |
OLD | NEW |