grid-calc-margin-ref.html (540B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <link rel="author" title="Sam Weinig" href="mailto:sam@webkit.org"> 5 <link rel="help" href="https://bugs.webkit.org/show_bug.cgi?id=301873"> 6 <style> 7 .cardStack { 8 display: grid; 9 width: 100px; 10 } 11 .card { 12 height: 100px; 13 } 14 #card1 { 15 background-color: lightpink; 16 margin-top: 50%; 17 } 18 #card2 { 19 background-color: lightgreen; 20 } 21 </style> 22 </head> 23 <body> 24 <div class="cardStack"> 25 <div id="card1" class="card"></div> 26 <div id="card2" class="card"></div> 27 </div> 28 </body> 29 </html>