@KapteynUniverse
Posted
Hi Lilla, nice job.
I saw you used grid for centering because someone recommended you to use it on one of your previous solution. I am not very good on grid but i think place-items: center;
is for centering the items inside their cells. Grid making 4 rows at the moment, because there is body, footer, and 2 more divs (i think these come from the github, not sure) so your main centering on its respected area right now. Using place-content:center;
might be better instead. You can check this video for the difference between them.
I prefer to use flex for basic layouts. It is just one more line of code than grid. You can use this for centering too
body{
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
}
Addition to what @loiccape said; they are links of the Jessica's socials. So instead of divs, using anchor tags with unordered list would be better. Like:
<ul>
<li><a href="...">...</a></li>
<li><a href="...">-...</a></li>
<li><a href="...">...</a></li>
<li><a href="...">...</a></li>
<li><a href="...">...</a></li>
</ul>
Marked as helpful
@KapteynUniverse
Thank you so much for all of this!!
I'll definitely try the flex way. I think the confusion came from not knowing when to use min/max-height the correct way. Also, thanks for the video for the difference, it's definitely something I need to think about a lot more. And practice. :) Anchor tags also make a lot more sense, I'm guessing it's also better for accessibility. Very helpful, thank you!