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

Flexbox, Responsive design, Mobile first, bootstrap 5

@hatwell-jonel

Desktop design screenshot for the 3-column preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


any recommendation to improve my coding skill especially HTML Semantics and CSS.

Community feedback

darryncodes 6,430

@darryncodes

Posted

Hi Hatwell,

Overall a pretty solid solution.

I'd highly recommend taking a look at your accessibility report and the learn more links to find out tons of information regarding semantics. In summary:

  • you should only have one <h1> per page
  • swap this <div class="wrapper container d-md-flex" role="main"> for <main class="wrapper container d-md-flex"> you don't need the role attribute if you use a <main>
  • semantic elements

All the best

Marked as helpful

0

@hatwell-jonel

Posted

@darryncodes thank you for reviewing my work, i will do your recommendations. i have a nice day.

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