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

Four card feature section Challenge

Bluebhot 20

@Borlarjhii

Desktop design screenshot for the Four card feature section coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Hello everyone, so this is my second challenge here, I'm not comfortable with my solution and I'm hoping you guys could guild me or correct my mistakes. Thank you.

Community feedback

Jane 1,040

@janegca

Posted

Hi Bluebhot, overall your design looks pretty good and is fairly responsive although you might want to add another breakpoint for the mid-range sizes.

One thing I would suggest is re-thinking the way you are naming sections and using id's for everything. For instance instead of first-section, id=first-h2, id=second-h2 try something like header, header > h2:first-of-type or perhaps, rather than using heading tags use span, h1, p so you can target them as header > span, header > h1, etc. As a general rule of thumb, id's are usually limited to anything you want to directly target with JS or for an exception-to-the-rule CSS style.

Hope that's of some help. Happy coding.

1

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