Source Code:
(back to article)
Submit
Result:
Report an issue
<!DOCTYPE html> <html> <head> <title>Title of the document</title> <style> .grey-container { height: 250px; width: 250px; display: grid; grid-gap: 20px; grid-template: repeat(4, 1fr) / repeat(2, 1fr); grid-auto-flow: row; background-color: #ccc; padding: 10px; } .box1 { background-color: #00f3ff; grid-row-start: 3; } .box2 { background-color: #ff00d4; } .box3 { background-color: #827c7c; } .box4 { grid-column-start: 2; background-color: orange; } </style> </head> <body> <div class="grey-container"> <div class="box1"></div> <div class="box2"></div> <div class="box3"></div> <div class="box4"></div> </div> </body> </html>