Fri, 16 Jan 2015 18:13:44 +0100
Integrate suggestion from review to improve consistency with existing code.
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-family:monospace; font-size:16px; padding:0; margin:0;
13 }
15 .colset {
16 -moz-column-count: 2;
17 -moz-column-gap: 0px;
18 -moz-column-rule: 1px solid black;
19 margin-bottom:1em;
20 width:30ch;
21 }
22 .colset.lvl2 {
23 -moz-column-rule: 1px solid blue;
24 }
25 .colset.lvl3 {
26 -moz-column-rule: 1px solid red;
27 }
28 p { margin: 0; }
29 .non-balancing {
30 -moz-column-fill: auto;
31 }
32 .fixed-height {
33 height:3em;
34 }
35 </style>
36 </head>
37 <body>
38 <div class="colset">
39 <p>one one one one one</p>
40 <div class="colset non-balancing lvl2">
41 <p>two two two two two</p>
42 </div>
43 </div>
44 <div class="colset">
45 <p>one one one one one<br>one</p>
46 <div class="colset fixed-height lvl2">
47 <p>two two two two two</p>
48 </div>
49 </div>
50 <div class="colset">
51 <p>one<br>one</p>
52 <div class="colset lvl2">
53 <p>two</p>
54 <div class="colset fixed-height lvl3">
55 <p>three three three three three three</p>
56 </div>
57 </div>
58 </div>
59 </body>
60 </html>