1122366-1-margin-collapse.html (849B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>Bug 1122366 - margin collapsing</title> 5 <style type="text/css"> 6 div { 7 font: 40px/1em serif; 8 height: 4em; 9 } 10 div.wrapper { 11 margin: 10px; 12 background: blue; 13 border-left: green solid .5em; 14 border-right: green solid 1.5em; 15 } 16 div.lr { 17 -webkit-writing-mode: vertical-lr; 18 writing-mode: tb-lr; /* IE11 */ 19 writing-mode: vertical-lr; 20 } 21 div.rl { 22 -webkit-writing-mode: vertical-rl; 23 writing-mode: tb-rl; /* IE11 */ 24 writing-mode: vertical-rl; 25 } 26 div.widthless 27 { 28 margin-right: 2em; 29 width: 0; 30 } 31 </style> 32 </head> 33 <body> 34 <div class="wrapper lr"> 35 <div class="widthless"></div> 36 <div class="widthless"></div> 37 </div> 38 <div class="wrapper rl"> 39 <div class="widthless"></div> 40 <div class="widthless"></div> 41 </div> 42 </body> 43 </html>