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

seyide hundeyin• 440

@SeyideHundeyin

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 always found CSS grid difficult and never wanted to use it on any of the challenges but I decided to give it a try and I spent the whole night googling and checking other people's solutions.

I definitely haven't gotten the hand of CSS grid but I am proud I was able to do this challenge and will use CSS grid in more challenges so I can understand it better.

let me know if you have any feedback for me.

Thanks

Community feedback

P
Grace• 27,950

@grace-snow

Posted

Hi Seyide, As already said you need a little gap (margin/padding) at the very top and bottom of the screen so your cards aren't hitting edge of viewport.

Your grid looks great to me. If you're having trouble with it, try using grid areas next time, you'll probably find them a lot easier than trying to work out line numbers.

The only issues I see at the moment are all with html, which should be corrected:

  • Headings must go in order, and you should only have one h1 per page. This is important for assistive technology and for search engines. I would recommend making all the peoples names into h2s and not using heading tags at all for the quotes.

  • sections are meant to be used for large chunks of a document, a bit like chapters of a book. Again the reasons are for clearly understandable document structure. Using them incorrectly can have a negative effect for assistive tech users. This whole challenge could be wrapped in one section and given a title of 'testimonials', but there should be no sections within it. I would swap those for divs.

Hope thats helpful. Keep going with you're learning, you're doing really well with these challenges. Happy coding!

2

seyide hundeyin• 440

@SeyideHundeyin

Posted

@grace-snow thanks for your feedback. I will work on it!

0

@yadprab

Posted

check out wesbos grid tutorial trust me you're going to love css grids soon it really solves many problems

1

seyide hundeyin• 440

@SeyideHundeyin

Posted

@yadprab thanks. I just got the traversy media's course

1

@yadprab

Posted

@SeyideHundeyin it's on youtube fun projects it helped me to understand more about grids and check out layout land channel too

1
seyide hundeyin• 440

@SeyideHundeyin

Posted

@yadprab Thanks. i will check it out!

1
El Ghali Khalid• 2,630

@limtedtorni000

Posted

This comment was deleted

0

seyide hundeyin• 440

@SeyideHundeyin

Posted

@limtedtorni000 Thanks i have done that

0
El Ghali Khalid• 2,630

@limtedtorni000

Posted

@SeyideHundeyin yeah the first time it wasn't but now is looking great

0
seyide hundeyin• 440

@SeyideHundeyin

Posted

@limtedtorni000 appreciate it!

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