.container { text-align: center; } .container div { padding: 15px; font-size: 32px; font-family: Helvetica; font-weight: bold; color: white; border-radius: 15px; } .header { background-color: #FFDE22; grid-column: 1 / 3; grid-row: 1 / 2; } .sidebar { background-color: #FF7755; grid-column: 1 / 2; grid-row: 2 / 4; } .nav { background-color: #00DDFF; grid-column: 2 / 3; grid-row: 2 / 3; } .article { background-color: #bccbde; grid-column: 2 / 3; grid-row: 3 / 4; } .article p { font-size: 18px; font-family: sans-serif; color: white; text-align: left; } .footer { background-color: #393f4d; grid-column: 1 / 3; grid-row: 4 / 5; } /* SOLUTION */ .container { display: grid; grid-template-columns: 1fr 3fr; grid-template-rows: 1fr 1fr 5fr 1fr; gap: 15px; }