<!DOCTYPE html> <html> <head> <style> #grid{ display: grid; height:250px; grid-template-rows: [header-start] 90px [header-end main-start] 1fr [main-end footer-start] 80px [footer-end]; background-color:lightblue; } #item1{ grid-row: main-start/main-end; background-color:lightgreen; } #item2{ grid-row: footer-start/footer-end; background-color:lightgray; } </style> </head> <body> <div id="grid"> <div id="item1">item1</div> <div id="item2">item2</div> </div> </body> </html>
Run
×
Share