Testimonial Grid

@digitalocean2345 Nice work, but you forgot the quites background image on Violet square. Regards

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

• To not only improve your HTML code but to also identify the main content of you page, you will want to wrap your entire site inside the main element.

More Info:📚

MDN Main 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 only headings in this component are the names of each individual; “Daniel Clifford”, “Jonathan Walters”, “Jeanette Harmon”, “Patrick Abrams” and “Kira Whittle”. Everything else should be wrapped in a paragraph Element.

• To improve the semantics of your component, you will want 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

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

Happy Coding!🎄🎁

Hello digital, how are you? I truly loved your project's outcome, however I have some advice that I hope you'll find useful:

To align some content in the center of the screen, always prefer to use display: flex; it will make the layout more responsive!

Example:

body {
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    min-height: 100vh;
}

I noticed that in higher resolutions the content is stretching a lot and this is harming the design of the project, to fix this in a simple way we can use a max-width.

@media (min-width: 900px)
.container {
    max-width: 1440px;
}

The remainder is excellent.

I hope it's useful. 👍