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

I used html and CSS grid layout tool

Adil Rafiq 120

@Adil-Rafiq

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 People! I completed this project to improve my layout skills which I did up to some point but I ran into few problems, described below: 1- The first one is that the text in the right most card does not fill the empty space. I could not find any method to some how smaller the heights of all the cards EVENLY so that there's no empty space left (as shown in the design).

2- The 2nd one is about the 'media queries' and it looks like a bug to me. When I first wrote the media queries for mobile and tablet view they worked perfectly but later when I was fixing the above problem I may have edited something that caused those media queries to come into affect at all.

Any help would be appreciated. Thank you :)

Community feedback

@faruking

Posted

I can only help by telling you to adjust the container so that its in the middle by using margin:auto on the container class. Also the color of the h2 class has to be changed from black to the required color. Lastly, you can check my designs for pointers about how to fill the texts in their respective containers. I think it has to do with the size of the container, the padding and the font size, line-height of the texts.

Marked as helpful

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