@Alex-Archer-I
Posted
Hi!
Congrats with your first challenge =)
You really use semantic tags right. As for responsiveness it's good that you are use max-width
property, but there is not much sense in the min-width
. I mean in the screens smaller than 250px
(if they exist) the content still will overflow. It's be a bit neater to use width: 95%
(or vh
as you doing now) to keep a little place between card and screen borders.
Also I suggest you to add min-height: 100vh
to body tag. Cos for now body could not take all the screen and this lead to white stripe at the bottom (you can see it on the screen of your project). The min
part is for the case if content became larger than the screen.
And a couple tiny additional suggestions =)
I see that you are already familiar with the rem
units. Use them for fonts as well - it's their first purpose.
And you can style image directly no need for div wrapper.
So, congrats again, it's a good start, keep doing =)