Skip to content
Submitted 14 days ago

Responsive Grid Layout

Nafis Sazzad Niloy•190
@methane-js
A solution to the Testimonials grid section challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

What are you most proud of, and what would you do differently next time?

I am mostly proud because I have successfully completed an advanced CSS Grid Project.

The project clearly reflects my expertise on CSS Grid.

What challenges did you encounter, and how did you overcome them?

The challenge was to make the Grid layout perfectly. But using the CSS Grid properties I made it successfully,

What specific areas of your project would you like help with?

If you find any improvements in my project, please let me know

Code

Please log in to post a comment

Log in

Community feedback

  • Andrey•4,080
    @dar-ju

    Great job!

    But the grid can be used more effectively. Firstly, when changing the screen width, you don't need to switch from grid to flex, grid can manage blocks well. You started correctly by assigning 4 columns to the grid, on the next media query, make it not 4, but 3 and move the right column down, that is, make 3 rows. And so on as the screen narrows.

    As a result, you don't need to switch to flex, your grid will just consist of 1 column.

    In the steel, everything is great, what can be improved - remove the extra div container for img, move the "image" class to img. For quotes, you can use the <blockquote> tag

    Good luck with your development!

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