column-balancing-nested-000.html (1242B)
1 <!-- 2 Any copyright is dedicated to the Public Domain. 3 http://creativecommons.org/licenses/publicdomain/ 4 --> 5 <!DOCTYPE html> 6 <html lang="en-US"> 7 <head> 8 <title>Testing nested balancing column sets</title> 9 <link rel="author" title="Mats Palmgren" href="https://bugzilla.mozilla.org/show_bug.cgi?id=822053"> 10 <style type="text/css"> 11 html,body { 12 color:black; background-color:white; font-size:16px; padding:0; margin:0; 13 } 14 15 .colset { 16 column-count: 2; 17 column-gap: 1px; 18 column-rule: 1px solid black; 19 border: solid silver; 20 width:30ch; 21 } 22 p { margin: 0; } 23 </style> 24 </head> 25 <body> 26 <div class="colset"> 27 <p>one one one one one</p> 28 <div class="colset"> 29 <p>two two two two two</p> 30 </div> 31 </div> 32 <br> 33 <div class="colset"> 34 <p>one one one one one</p> 35 <div class="colset"> 36 <p>two two two two two</p> 37 <div class="colset"> 38 <p>three three three three three</p> 39 </div> 40 </div> 41 </div> 42 <br> 43 <div class="colset"> 44 <p>one one one one one</p> 45 <div class="colset"> 46 <p>two two two two two</p> 47 <div class="colset"> 48 <p>three three</p> 49 <div class="colset"> 50 <p>four four four four four</p> 51 </div> 52 </div> 53 </div> 54 </div> 55 </body> 56 </html>