Work in progress
Learn Layout
Flexbox
Single column or row
.flex {
align-items: center;
display: flex;
justify-content: center;
}
Grid
Multiple columns and rows
.grid {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-template-rows: auto;
place-items: center;
}
Want to learn more?
We recommend taking Kevin Powell's 21-Day Challenge: Conquering Responsive Layouts