Skip to content
Submitted over 1 year ago

Testimonial Grid Section using flex and grid css.

Mel•90
@devmelody
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

Hello, all. What's the reason for the excess blank space when I change to mobile view, please? I even tried to hide whatever overflow might exist, still no change. Any advice and comment is welcome.

Community feedback

  • C H A R A N 🎯•2,670
    @0xabdulPosted over 1 year ago

    Hello there Congratulations you finished the Testimonial Grid Section ...🎉

    • A Few Recommendation for you improve your code..

    • Html 🏷️ :

    • in fact html page Must be included only one main landmark..

    • land mark..?

    • The main landmark should be a top-level landmark. When a page contains nested document and/or application roles (e.g. typically through the use of iframe and frame elements), each document or application role may have one main landmark. If a page includes more than one main landmark, each should have a unique label.

    • EX :

    <body>
<div class="container" role="main">
//Whole html code here🏷️
</div>
</body>
    • In Css 🎨 :
    • well your Testimonial Grid Section is not center aligning🎯 so fix the problem..
    body {
display : flex;
align-item :  center;
justify-content : center;
max-width : 100%;
height : 100vh;
overflow-x : hidden;
}
    • I Hope it's useful for you
    • Happy Coding 😃
    Marked as helpful
    0

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