Your code looks great. I think there are ways it can be better though instead of using flex box you can use grid. Which makes the alignment part SO MUCH EASIER ! And simpler, it will take less code. This is how my container code looks like !
.container{ display: grid; gap: 2.5rem; font-family: var(--ff-barlow); width: 90rem; margin: 5rem;
min-height: 50rem;
max-height: 100rem;
grid-template-columns: repeat(4,1fr);
grid-template-rows: 1fr 1fr;
grid-template-areas:
"card-daniel card-daniel card-jonathan card-kira"
"card-jeanette card-patrick card-patrick card-kira";
}
grid template areas allow me to layout my code in the grid the way I want it to look ! All I needed to do for media is to change the container abit and the layout abit ! It takes less code.
0
