relative-child-overflowing-column-gap.html (542B)
1 <!DOCTYPE html> 2 <title>Relative child can overflow onto the column gap area</title> 3 <link rel="help" href="https://drafts.csswg.org/css-multicol/"> 4 <link rel="match" href="relative-child-overflowing-column-gap-ref.html"> 5 6 <style> 7 body { 8 margin: 0px; 9 } 10 11 .multicol { 12 width: 200px; 13 column-count: 2; 14 column-gap: 50px; 15 } 16 17 .relative-layer { 18 position: relative; 19 } 20 21 .child { 22 width: 100px; 23 height: 100px; 24 background: green; 25 } 26 </style> 27 <div class="multicol"> 28 <div class="relative-layer"> 29 <div class="child"></div> 30 </div> 31 </div>