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 Grid Testimonials Section

@wdelanoy

Desktop design screenshot for the Testimonials grid section coding challenge

This is a solution for...

  • HTML
  • CSS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


  • Continued to use custom properties to define colors

  • Utilized BEM naming conventions for clear class names

  • Used utility classes such as card-container, and then secondary classes such as card-light, card-md, card-dark, and card-brand to define universal CSS properties vs individual properties based on color

  • Utilized max-width inside my media query to ensure that the grid didn't get too distorted horizontally. Once the width of the container exceeded 1268px, the grid will not grow any more

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