Skip to content
Submitted over 3 years ago

responsive landing page, css grid, flexbox

Brad Cole•80
@artwired
A solution to the Testimonials grid section challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

One problem I had was figuring out how to center vertically for any desktop viewport height. Would love to learn how I might have gone about that.. Any other suggestions to improve my code are welcome as well!

Code

Please log in to post a comment

Log in

Community feedback

  • Brad Cole•80
    @artwired

    thank you so much! I'll. give it a try :)

  • Byron•2,290
    @byronbyron

    Hi Brad

    You can remove the position: absolute; top: 13%; from #container and add an align-items: center; to the body, that should center it vertically.

    @media screen and (min-width: 376px)
    body {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 100vh;
        position: relative;
        overflow-x: none;
    }

    #container {
        width: 1440px;
    }
}

    Hope that helps! 👍

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