layout/reftests/columns/margin-collapsing-bug616722-1.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: 3px 0; background:pink; }
michael@0 9 div {
michael@0 10 background-color:lime;
michael@0 11 margin: 0em;
michael@0 12 border: 1px solid black;
michael@0 13 }
michael@0 14 .no-border {
michael@0 15 border-style: none;
michael@0 16 }
michael@0 17
michael@0 18 .columns {
michael@0 19 -webkit-column-count: 1;
michael@0 20 -moz-column-count: 1;
michael@0 21 column-count: 1;
michael@0 22 }
michael@0 23 </style>
michael@0 24 </head>
michael@0 25 <body>
michael@0 26 <div class="columns">
michael@0 27 <p style="margin-top:10px">The quick brown fox jumps over the lazy dog.</p>
michael@0 28 </div>
michael@0 29 <div class="columns">
michael@0 30 <p style="margin-bottom:10px">The quick brown fox jumps over the lazy dog.</p>
michael@0 31 </div>
michael@0 32 <div class="columns">
michael@0 33 <p style="margin:10px 0">The quick brown fox jumps over the lazy dog.</p>
michael@0 34 </div>
michael@0 35 <div class="columns">
michael@0 36 <p style="margin:20px 0 10px 0">The quick brown fox jumps over the lazy dog.</p>
michael@0 37 </div>
michael@0 38 <div class="columns">
michael@0 39 <p style="margin:20px 0 10px 0"></p>
michael@0 40 </div>
michael@0 41
michael@0 42 <div class="columns no-border">
michael@0 43 <p style="margin-top:10px">The quick brown fox jumps over the lazy dog.</p>
michael@0 44 </div>
michael@0 45 <div class="columns no-border">
michael@0 46 <p style="margin-bottom:10px">The quick brown fox jumps over the lazy dog.</p>
michael@0 47 </div>
michael@0 48 <div class="columns no-border">
michael@0 49 <p style="margin:10px 0">The quick brown fox jumps over the lazy dog.</p>
michael@0 50 </div>
michael@0 51 <div class="columns no-border">
michael@0 52 <p style="margin:20px 0 10px 0">The quick brown fox jumps over the lazy dog.</p>
michael@0 53 </div>
michael@0 54 <div class="columns no-border">
michael@0 55 <p style="margin:20px 0 10px 0"></p>
michael@0 56 </div>
michael@0 57
michael@0 58 </body></html>

mercurial