Skip to content
Submitted over 4 years ago

Responsive Mobile-first with CSS Grid, using Sass and BEM

Gabrieleā€¢280
@gabriardi
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Single price grid component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

How would you center vertically the container in the desktop version? In the end I managed to do it in a responsive way using a grid in the body so that the container would be an element of the grid. Is there a better or more common solution?

Community feedback

  • Emmilie Estabilloā€¢5,540
    @emestabilloPosted over 4 years ago

    Hi Gabriele, congrats on this challenge! Try this on your base.scss line 26-29:

    display: flex;
flex-direction: column;
align-items: center;
justify-content: center;

    Also check out this article for more ways to achieve centering. As you can see, my personal go-to is flexbox...only because it's easier for me to remember :-) Ultimately, it's all about preference. Hope this helps!

    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