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
Request path contains unescaped characters
Not Found

Submitted

Testimonials grid section

@NinoTsitsriashvili

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

Lucas ๐Ÿ‘พโ€ข 104,420

@correlucas

Posted

๐Ÿ‘พHello Nino, congratulations for your solution!

Your grid layout is just great, there's only some work to do improving some details.

1.Use blockquote instead of p to mark the quote with the proper and semantic tag.

2.Work the opacity value for the box-shadow the shadow is a little bit too strong, giving it less opacity values you can reach a smoother shadow.

3.The profile image is a little bit to big, the proper size its height/width: 36px;

4.Increase the card padding to have a better gap between the card bounds.

See the fixes below:

.card {
    border-radius: 8px;
    padding: 32px;
    box-shadow: 40px 60px 50px -47px rgb(72 85 106 / 25%);
}

Hope it helps Nino, happy coding!

Marked as helpful

0

@NinoTsitsriashvili

Posted

@correlucas Thank you for your attention! I will correct my code.

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