contain-intrinsic-size-022-ref.html (667B)
1 <!doctype html> 2 <meta charset="utf8"> 3 <title>CSS contain-intrinsic-size: grid definite size</title> 4 <link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org"> 5 <link rel="help" href="https://drafts.csswg.org/css-sizing-4/#intrinsic-size-override"> 6 7 <style> 8 #grid { 9 border: 3px solid black; 10 display: grid; 11 grid-template: 55px 66px / 77px 88px; 12 box-sizing: content-box; 13 width: 70px; 14 height: 80px; 15 background: lightblue; 16 grid-gap: 5px; 17 } 18 .item { 19 background: lightgreen; 20 opacity: 0.5; 21 height: 100%; 22 } 23 </style> 24 25 <div id=grid> 26 <div class=item></div> 27 <div class=item></div> 28 <div class=item></div> 29 <div class=item></div> 30 </div>