Testimonial Page using CSS Grid

Community feedback

• 

  Lucas 👾•104,340

  @correlucasPosted about 2 years ago

  👾Hello Benn, congratulations for your new solution!

  I know how hard is to setup this grid layout, but I can tell that you've paid a lot of attention for each detail. Here's some tips:

  1.You did a really good work here putting everything together, something you can improve its your code html markup and semantics. You can replace the <div> that wraps each card with <article> you can wrap the paragraph with the quote with the tag <blockquote> this way you'll wrap each block of element with the best tag in this situation.

  2.Align your component to the screen center using min-height: 100vh and flexbox to make the component align to the body height size:

  @media (min-width: 1120px)
  body {
      min-height: 100vh;
      margin: 0;
      padding: 8em;
      display: flex;
      align-items: center;
      justify-content: center;
  }
  

  ✌️ I hope this helps you and happy coding!

  Marked as helpful

  1
• 

  Tiago José•300

  @tiago-jv0Posted about 2 years ago

  Hello Benny, great job solving this challenge, about your question, i think that you could use grid-template-areas to help others understand better you layout organization, it is really helpful when you have to lay out a complex design, you can read more about this feature here : https://css-tricks.com/almanac/properties/g/grid-template-areas/

  Marked as helpful

  0

  ---

  

  Benny•180

  @dbenny1Posted about 2 years ago

  @tiago-jv0 Thanks alot. Still new to CSS Grid. I'm gonna try that out.

  0