Insure landing page with HTML & CSS only

Solution retrospective
This project took a bit longer and it's certainly far from being pixel perfect, but I definitely learned quite a bit through the process. The part that is still bothering me a bit is the top section of the website (after the nav bar - the "Humanizing your insurance" part). The proportions and spacing are a bit off, but I wanted it to scale well. Recommendations on how to code that section more efficiently (and to better match the design) would be appreciated.
Thanks for taking a look!
Please log in to post a comment
Log in with GitHubCommunity feedback
- @clockwerkz
Looking good! The headline looks more condensed in yours vs the design; I think maybe adding 1px of letter spacing might help that.. or maybe it's the font weight? Also, in the mobile version it looks like the page is still using the desktop version of the hero image... I would recommend using srcset to switch from the desktop to the mobile version of the image.. Nice work!
- @LizzSoup
Hello, fellow skillcrusher.
Good work, and nice to see you on here! Hopefully someone can come through with the tips you're looking for.
I've found it really difficult to get things looking pixel perfect without the sketch files, though there are some chrome plug ins you could look into the might help you get it a little closer.
There's a very pale grey footer background that's missing on your version, should be an easy fix!
Join our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord