overflowing-block-003.html (1069B)
1 <!DOCTYPE html> 2 <meta charset="utf-8"> 3 <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com"> 4 <link rel="author" title="Mozilla" href="https://www.mozilla.org/"> 5 <link rel="match" href="overflowing-block-003-ref.html"> 6 <link rel="help" href="https://drafts.csswg.org/css-break-3/#parallel-flows"> 7 <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=563436"> 8 <link rel="stylesheet" href="/fonts/ahem.css"> 9 10 <style> 11 .multicol { 12 width: 150px; 13 height: 50px; 14 columns: 2; 15 column-gap: 0; 16 column-fill: auto; 17 border: 3px solid black; 18 margin: 10px; 19 } 20 .outer { 21 margin-right: 25px; 22 } 23 .inner { 24 background: green; 25 color: green; 26 font: 25px/1 Ahem; 27 word-break: break-all; 28 } 29 </style> 30 31 <p>This test passes if there are two 50x50 green squares in each black box.</p> 32 33 <div class="multicol"> 34 <div class="outer"> 35 <div class="inner" style="float: left"> 36 AAAA BBBB 37 </div> 38 </div> 39 </div> 40 41 <div class="multicol"> 42 <div class="outer" style="height: 0"> 43 <div class="inner" style="height: 100px"></div> 44 </div> 45 </div>