overflow-clip-margin-visual-box-ref.html (1049B)
1 <!doctype html> 2 <meta charset="utf-8"> 3 <title>Verifies overflow-clip-margin supports visual-box</title> 4 <link rel="help" href="https://www.w3.org/TR/css-overflow-3/#propdef-overflow-clip-margin"> 5 <link rel="author" title="Khushal Sagar" href="mailto:khushalsagar@chromium.org"> 6 <style> 7 .container { 8 width: 100px; 9 height: 100px; 10 overflow: visible; 11 padding: 10px; 12 border: 10px solid black; 13 margin: 10px; 14 background: grey; 15 } 16 17 .inner_border_box { 18 width: 140px; 19 height: 140px; 20 position: relative; 21 top: -20px; 22 left: -20px; 23 background: blue; 24 } 25 26 .inner_padding_box { 27 width: 120px; 28 height: 120px; 29 position: relative; 30 top: -10px; 31 left: -10px; 32 background: blue; 33 } 34 35 .inner_content_box { 36 width: 100px; 37 height: 100px; 38 background: blue; 39 } 40 </style> 41 <div class="container"> 42 <div class="inner_border_box"></div> 43 </div> 44 <div class="container"> 45 <div class="inner_padding_box"></div> 46 </div> 47 <div class="container"> 48 <div class="inner_content_box"></div> 49 </div>