Skip to content
Submitted almost 2 years ago

Testimonial Grid

Nikki•80
@N11KK11
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

I forgot to place background apostrophe img on Daniel Clifford's testimonal. I will edit soon. This was good practice for learning CSS grid. Any advice is much appreciated.

Community feedback

  • 👾 Ekaterine Mitagvaria 👾•7,600
    @catherineisonlinePosted almost 2 years ago

    Looks cool! I would also add some margin or padding at the end of the container so there is some space. And add lang="en" to the HTML tag to get rid of the reported error 👍

    Marked as helpful
    1
  • Adriano•38,410
    @AdrianoEscarabotePosted almost 2 years ago

    Hello Nikki, 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;
}

    <html> element must have a lang attribute, to inform the language of the page content!

    to solve this use the attribute in the html tag;

    <html lang="en">

    The remainder is excellent.

    I hope it's useful. 👍

    Marked as helpful
    1

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