Skip to content
Submitted over 3 years ago

Grid and Flexbox Responsive Design

Rapha445•100
@Rapha445
A solution to the Social proof section challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

Hi everyone ! :) This was my first attempt at using CSS Grid. I feel more comfortable with Flexbox so I found myself to fall back on it quite a lot. Any suggestions on my code?

Also a few questions:

  • For this challenge I couldn't figure out how to get to background position right. Any tips?
  • How can I reduce the amount of media queries that I am using?

Thank you for helping!

Code

Please log in to post a comment

Log in

Community feedback

  • jemeneradev•580
    @jemeneradev

    Check out: https://cssgridgarden.com/

    It's a great, fun grid practice game.

    To be honest, grid might have complicated things a bit.

    <img src="images/icon-star.svg" alt=""> <img src="images/icon-star.svg" alt=""> <img src="images/icon-star.svg" alt=""> <img src="images/icon-star.svg" alt=""> <img src="images/icon-star.svg" alt="">

    That's a lot of stars. Consider playing around with background-repeat and the width of a star container to get the right amount of stars.

    https://css-tricks.com/almanac/properties/b/background-repeat/

    Marked as helpful

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