Toggle navigation
☰
Home
HTML
CSS
Scripting
Database
<!doctype html> <title>Example</title> <style> #grid { display: grid; grid-template-rows: 50vh repeat(4, 1fr); grid-template-columns: repeat(4, 1fr); grid-gap: 10px; height: 100vh; margin: 0; } #grid > div { color: white; font-size: 4vw; padding: 10px; background: gold; } #grid > div:nth-child(1) { grid-column: span 4; } #grid > div:nth-child(2) { grid-row: span 4; } #grid > div:nth-child(4) { grid-row: span 2; } #grid > div:nth-child(5) { grid-row: span 3; } #grid > div:nth-child(6) { grid-row: span 3; } </style> <body id="grid"> <div>1</div> <div>2</div> <div>3</div> <div>4</div> <div>5</div> <div>6</div> <div>7</div> <div>8</div> <div>9</div> </body>