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

Responsive 3-column preview card with accessible links and BEM mixes

#accessibility#bem

@JulioCinquina

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


Hi, everyone! 👋🏻

In this challenge, I practiced using Grid to create a responsive component in a mobile-first workflow.

While coding it, I learned how to create accessible links by giving them descriptive ARIA labels. Additionally, even though I am not entirely familiarized with the official BEM documentation yet, I learned about the concept of mixes in BEM and found it useful when creating the buttons in this challenge. It's all described in the GitHub repo!

Any feedback will be much appreciated. Thank you!

Community feedback

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