Skip to content
Submitted over 3 years ago

Testimonials Grid - CSS Grid and Custom Properties

Dave•5,295
@dwhenson
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Testimonials grid section
  • HTML
  • CSS
2junior

Design comparison

SolutionDesign

Solution retrospective

Any feedback, comments or criticisms most welcome!

I would particularly welcome any suggestions on how to improve the grid rules I have used as I think there may be a better way to approach this layout.

Also, I have used min-content on the rows to set the height, I would have preferred to keep the auto default, but this seemed to add additional height to the rows. Can any one explain why this might be or point me to a good resource on this?

Thanks for any inputs!

Community feedback

  • kotesh_dev•0
    @kotesh-aryaPosted over 3 years ago

    Hey man, the design looks amazing, But What if we use semantic elements, instead of using div's and giving class names to them and later styling them.

    I think by using these semantic elements, we can avoid usage of media-queries

    0
    Dave•5,295
    @dwhensonPosted over 3 years ago

    @kotesh-arya thanks. I agree! What semantic elements would you suggest in this case? Thanks

    0
    kotesh_dev•0
    @kotesh-aryaPosted over 3 years ago

    @dwhenson <main> which you can use as the main container and <article> used as the child elements of the grid...

    0
    kotesh_dev•0
    @kotesh-aryaPosted over 3 years ago

    @kotesh-arya give that a try and lemme know, the way it worked

    0

Please log in to post a comment

Log in with GitHub

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