Testimonials Grid Section

Community feedback

• 

  バレンタイン 😈•64,190

  @VCaramesPosted almost 2 years ago

  Hey there! 👋 Here are some suggestions to help improve your code:

  • To properly center your content to your page, you will want to add the following to your Body element (this method uses CSS Grid):

  body {
      min-height: 100vh;
      display: grid;
      place-content: center;
  }
  

  More Info:📚

  Centering in CSS

  • For the testimonials, it is best ✅ to to wrap each individual testimonial component in a figure element, the individuals information should be wrapped in a figcaption element and lastly, the testimonial itself should be wrapped in a blockquote element.

  Code:

  <figure>
     <figcaption></figcaption>
     <blockquote></blockquote>
  </figure>
  

  More Info:📚

  MDN Figure Element

  • The profile images alt tags need to be improved. It should state the following; “Headshot of -person’s full name-“

  More Info:📚

  Headshot Alt Text

  • The names of each individual are headings so they should be wrapped in a Heading Element. Since they are all equal level of importance, the h2 heading will be the best choice.

  If you have any questions or need further clarification, feel free to reach out to me.

  Happy Coding! 🎄🎁

  Marked as helpful

  0

  ---

  

  バレンタイン 😈•64,190

  @VCaramesPosted almost 2 years ago

  • NEVER ❌ do this as it creates accessibility issues for users and it is outdated.

  html {
    font-size: 62.5%;
  }
  

  • Your CSS Reset is being underutilized. To fully maximize it, you will want to add more to it.

  Here are some examples that you can freely use:

  Josh Comeau Reset

  Eric Meyer Reset

  0

  

  spirit•470

  @spirit-101Posted almost 2 years ago

  @vcarames Would you be able to elaborate a bit more on the problem with html { font-size: 62.5%; }? Thanks for the feedback!

  1

  

  バレンタイン 😈•64,190

  @VCaramesPosted almost 2 years ago

  @spirit-101

  You don’t have to read the entire thing, you can skip to the "The 62.5% trick" section.

  https://www.joshwcomeau.com/css/surprising-truth-about-pixels-and-accessibility/

  1