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

@nmrtsnh

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


Hello everyone,

I am Namrata and this is my solution for this challenge.

If you have any suggestions to improve my code, please feel free to share!

Thank you 🙏

Community feedback

@matiasluduena23

Posted

Hi Namrata! Good work!!! Your media query works perfectly fine! Just one advice that might help you.

  • To avoid that your content go all away to the width sides, you can use a max-width in your main.
main {
   display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: repeat(2, 1fr);
  gap: 20px;
  margin-left: 47px; //remove this line
  margin-right: 47px;//remove this line
  margin-top: 100px; 
  max-width: 1000px; // add this line
  margin-inline: auto; //add this line( center you content)
}

The margin-inline is the same that say (margin-left- margin-right)

Look this when you have time.

Hope this help you!

Good code!!!

Matias

Marked as helpful

0

@nmrtsnh

Posted

@matiasluduena23 Hi Matias. Thank you for the feedback!

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