layout/reftests/columns/margin-collapsing-bug616722-1-ref.html

Fri, 16 Jan 2015 18:13:44 +0100

author
Michael Schloh von Bennewitz <michael@schloh.com>
date
Fri, 16 Jan 2015 18:13:44 +0100
branch
TOR_BUG_9701
changeset 14
925c144e1f1f
permissions
-rw-r--r--

Integrate suggestion from review to improve consistency with existing code.

michael@0 1 <!DOCTYPE html>
michael@0 2 <html><head>
michael@0 3 <meta http-equiv="content-type" content="text/html; charset=UTF-8">
michael@0 4 <title>616722-1</title>
michael@0 5
michael@0 6 <style type="text/css">
michael@0 7 body,html { margin:0;padding: 10px;}
michael@0 8 p { margin: 0; background:pink; }
michael@0 9 .columns {
michael@0 10 -webkit-column-count: 1;
michael@0 11 -moz-column-count: 1;
michael@0 12 column-count: 1;
michael@0 13 background-color:lime;
michael@0 14 margin: 0em;
michael@0 15 border: 1px solid black;
michael@0 16 }
michael@0 17 .no-border {
michael@0 18 border-width:0;
michael@0 19 }
michael@0 20 </style>
michael@0 21 </head>
michael@0 22 <body>
michael@0 23 <div class="columns">
michael@0 24 <div style="padding:10px 0 3px 0"><p>The quick brown fox jumps over the lazy dog.</p></div>
michael@0 25 </div>
michael@0 26 <div class="columns">
michael@0 27 <div style="padding:3px 0 10px 0"><p>The quick brown fox jumps over the lazy dog.</p></div>
michael@0 28 </div>
michael@0 29 <div class="columns">
michael@0 30 <div style="padding:10px 0"><p>The quick brown fox jumps over the lazy dog.</p></div>
michael@0 31 </div>
michael@0 32 <div class="columns">
michael@0 33 <div style="padding:20px 0 10px 0"><p>The quick brown fox jumps over the lazy dog.</p></div>
michael@0 34 </div>
michael@0 35 <div class="columns">
michael@0 36 <div style="padding:20px 0 0 0"></div>
michael@0 37 </div>
michael@0 38
michael@0 39 <div class="columns no-border">
michael@0 40 <div style="padding:10px 0 3px 0"><p>The quick brown fox jumps over the lazy dog.</p></div>
michael@0 41 </div>
michael@0 42 <div class="columns no-border">
michael@0 43 <div style="padding:3px 0 10px 0"><p>The quick brown fox jumps over the lazy dog.</p></div>
michael@0 44 </div>
michael@0 45 <div class="columns no-border">
michael@0 46 <div style="padding:10px 0"><p>The quick brown fox jumps over the lazy dog.</p></div>
michael@0 47 </div>
michael@0 48 <div class="columns no-border">
michael@0 49 <div style="padding:20px 0 10px 0"><p>The quick brown fox jumps over the lazy dog.</p></div>
michael@0 50 </div>
michael@0 51 <div class="columns no-border">
michael@0 52 <div style="padding:20px 0 0 0"></div>
michael@0 53 </div>
michael@0 54 <!--
michael@0 55 <div class="columns no-border" style="margin-bottom:3px">
michael@0 56 <div><p>The quick brown fox jumps over the lazy dog.</p></div>
michael@0 57 </div>
michael@0 58 <div class="columns no-border" style="margin-top:3px">
michael@0 59 <div><p>The quick brown fox jumps over the lazy dog.</p></div>
michael@0 60 </div>
michael@0 61 <div class="columns no-border">
michael@0 62 <div><p>The quick brown fox jumps over the lazy dog.</p></div>
michael@0 63 </div>
michael@0 64 <div class="columns no-border" style="margin-top:20px">
michael@0 65 <div><p>The quick brown fox jumps over the lazy dog.</p></div>
michael@0 66 </div>
michael@0 67 <div class="columns no-border">
michael@0 68 <div></div>
michael@0 69 </div>
michael@0 70 -->
michael@0 71 </body></html>

mercurial