.container{ display:grid; grid-template-rows:repeat(3,100px); /*grid-template-columns: repeat(2,100px);*/ /*🔅*/ grid-template-columns: 30% 70%; border: 3px solid lightgray; height:100vh; } .box{ background-color:gold; }
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <link rel="stylesheet" href="style.css"/> </head> <body> <!-- 💛 --> <div class="container"> <div class="box">A</div> <div class="box">B</div> <div class="box">C</div> <div class="box">D</div> </div> </body> </html>
Top comments (0)