flex-gap-decorations-025-ref.html (646B)
1 <!DOCTYPE html> 2 <link rel="help" href="https://drafts.csswg.org/css-gaps-1/"> 3 <link rel="author" title="Javier Contreras" href="mailto:javiercon@microsoft.com"> 4 <style> 5 body { 6 margin: 0; 7 } 8 9 main { 10 display: flex; 11 flex-wrap: wrap; 12 gap: 10px; 13 } 14 15 .item { 16 background-color: teal; 17 height: 50px; 18 flex-basis: 100%; 19 } 20 21 .row-gap { 22 position: absolute; 23 top: 50px; 24 left: 0px; 25 background: gold; 26 width: 100%; 27 height: 10px; 28 } 29 </style> 30 <main> 31 <div class="item"></div> 32 <div class="item"></div> 33 <div class="row-gap"></div> 34 </main>