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-page

OpokuWare 230

@opoku334

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


I found this project to be a good start to learn grid layouts Feel free to point out any mistakes I made in the project

Community feedback

Arne 1,110

@Dudeldups

Posted

Hello 👋🏻

Let me give you some tips for your code:

  • You are declaring the font-size in px, you should use rem instead. This way, the text will scale if the user has set a custom font-size in their browser.

  • Maybe try to avoid using px in general in your code. Kevin Powell has a good video on that topic:

https://www.youtube.com/watch?v=N5wpD9Ov_To&t=19s

  • You should use a modern CSS reset, not just resetting the padding and margin. Either use google to find one or you could use this one:

https://andy-bell.co.uk/a-modern-css-reset/

  • The grid container is not centered vertically on the page in desktop view and it should have a max-width so it will not span the whole view width on large screens

  • Your HTML should have a <main> element (here, probably the grid container)

  • Heading elements should be in descending order. The names of the users are better off being regular <p> elements.

Hope this helps and happy coding 👾

1

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