Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Huddle landing page with alternating feature blocks - HTML and sass

SimpleMB 260

@SimpleMB


Design comparison


SolutionDesign

Community feedback

P
Matt Studdert 13,611

@mattstuddert

Posted

Great work on this challenge! Here are a couple of tips after looking at your code:

  • Your selector specificity is quite high at the moment when it doesn't need to be. As a general rule of thumb, you want to write your selectors to be as specific as they need to be in order to apply the styles, but no more specific than that. Therefore, for example, this selector that you've got: body .wrapper main .hero header {, could be updated to just: header {.
  • Instead of using max-width media queries, I'd recommend having a go at using min-width and working with a mobile-first approach. This has the benefit of loading in fewer styles for mobile users and many developers actually find the workflow more efficient.

I hope you find those tips helpful. Keep up the great work!

0

Please log in to post a comment

Log in with GitHub
Discord logo

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