@raficode2303
Posted
the layout looks good, i noticed some little things:
- the page max-width need to be smaller => smaller cards.
- jeanette card should not be the 2nd card at mobile/tablet mode.
- there is no need
.cards{min-width: 375px;}
, just remove thebody{ margin: 6vw 10vh;}
and leet css to do it responsive thing. try to avoid fixed sizes. the center of the page horizontally and vertically shouldn't be depend on fixed margin. not all screen the same. try to find a better way to center the page. - try to avoid things like:
.kira {grid-area: kira;}
and<div class="card kira">
. the names is to specific. think what will happen if you was told to replace kira card with john card.. it was meanning that you was needed to change many HTML and CSS lines. better way is something like:.card-5{grid-area: card-5;}
and<div class="card card-5">
. try to keep it modular /component that can fix to wide possibilities.
great work, keep to build! 👷♂️
Marked as helpful
@raficode2303
Hello buddy! 🤗
Thank you very much for your tips, they were valuable, I tidied up the code but there are some things that I will leave to apply in the next challenge as the code was already structured and I'm still learning how to use relative measurements but I think I'm making progress, thank you very much!