Skip to content
Submitted 5 months ago

Testimonials grid section vanilla css, grid

JacobKnittle•110
@JacobKnittle
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Testimonials grid section
  • HTML
  • CSS
2junior

Design comparison

SolutionDesign

Solution retrospective

What are you most proud of, and what would you do differently next time?

Using grid-template-area for the first time. Not have as much redundant css

What challenges did you encounter, and how did you overcome them?

had a had time with grid until I used grid-template-area and grid-area together to get the layout

What specific areas of your project would you like help with?

General advice for how to structure a lot of cards that are similar but not exact to save on redundant css.

Community feedback

  • David Turner•4,150
    @brodiewebdtPosted 5 months ago

    Nice job. A couple of suggestions. You want your main content to be in a Main tag for accessibility. You should also use the blockquote tag for the testimonial quotes. There are several contrast issues with the design. It isn't required to fix them in the challenge, but it will help fix accessibility issues. Get AXE dev tools: AXE dev tools

    Hope this helps David

    Marked as helpful
    0

Please log in to post a comment

Log in with GitHub

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