Nakoya Wilson• 1,530
@nakoyawilson
Posted
Instead of doing a 3 column grid and specifying widths, I would suggest doing a 4 column grid and using span 2 for the wider boxes. I experimented with your code and used this to achieve the layout.
.flex-container {
display: grid;
grid-template-columns: repeat(4, 1fr);
grid-template-rows: auto auto;
max-width: 70rem;
gap: 10px;
align-items: stretch;
}
.boxes {
margin: 0;
}
.box-1 {
grid-column: span 2;
}
.box-4 {
grid-column: span 2;
}
.box-5 {
grid-column: 4 / 5;
grid-row: 1 / 3;
}
Marked as helpful
2
Scott Wilder• 120
@Scott-Wilder
Posted
@nakoyawilson thank you for the feedback
0