grid-flex-spanning-items-001.html (709B)
1 <!DOCTYPE html> 2 <meta charset="utf-8"> 3 <title>CSS Grid Layout Test: Intrinsic sizing of grid with spanning flex items in a min-content container</title> 4 <link rel="match" href="grid-flex-spanning-items-001-ref.html"/> 5 <link rel="help" href="https://drafts.csswg.org/css-grid-2/#intrinsic-sizes"/> 6 <link rel="author" title="Emily McDonough" href="mailto:emcdonough@mozilla.com"/> 7 <style> 8 #mygrid { 9 display: grid; 10 grid-template-columns: 1fr 30px; 11 border: 10px solid fuchsia; 12 width: min-content; 13 } 14 #item { 15 grid-column: 1 / span 2; 16 } 17 #filler { 18 width: 300px; 19 height: 50px; 20 background: aqua; 21 } 22 </style> 23 <div id="mygrid"> 24 <div id="item"> 25 <div id="filler"></div> 26 </div> 27 </div>