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

Testimonials Grid Section Main

has-dev11 80

@has-dev11

Desktop design screenshot for the Testimonials grid section coding challenge

This is a solution for...

  • HTML
  • CSS
2junior
View challenge

Design comparison


SolutionDesign

Community feedback

@JawadM2002

Posted

There are some semantic HTML elements that have been utilised, such as <article> for testimonial cards and '<img>' for images, which means that it is semantically correct. The layout is responsive and adapts well to different screen sizes, transitioning smoothly from a four-column grid to a single-column layout. The code is well-structured, readable, and reusable with clear classes and comments. The CSS uses variables to define colours and font families, making the code concise and easy to maintain. However, it could be improved by giving a detailed description for the alt attribute for the images. Overall solution is very close to the design, but some adjustments can be made to the image sizes, text alignment and colour variations to match the design closely. But it still demonstrates a great practice with CSS Grid, keep up the great practice. :)

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