hi there! ๐
- since the whole idea behind this is to share social links with people I guess you should include
<a>
tags within the list items to actually lead the users somewhere:
<ul>
<li><a href="">Github</a></li>
...
</ul>
-
you should use
min-height
instead ofheight
on the<main>
tag, height prevents users on smaller screens to scroll down on the page if the content overflows the 100vh -
since you applied
height: 100vh
and made it a flex container it's not necessary to apply height on thebody
as well -
try using relative units instead of pixels, it makes it easier to build responsive designs and gives the chance to users with bad eyesight to increase the font size of the page
-
don't apply
height
orwidth
to your elements, it kills responsivity, let the child elements determine these. If you wanna create a "gap", so a max or min value to the width of your elements usemax-width
ormin-width
Hope this was helpful ๐
Good luck and happy coding! ๐
Marked as helpful