Skip to content
Submitted over 3 years ago

responsive page using CSS grid

Kristýna•40
@KristynRiho
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Four card feature section
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

Hello, this is the first time I tried to use CSS Grid, if you have any recommendations for my code, I'll appreciate it.

Community feedback

  • Folarin Akinloye•1,240
    @folathecoderPosted over 3 years ago

    Hi KRISTÝNA!

    Nice implementation and clean CSS code. Kudos!

    I only had the privilege to view your work on mobile device, so I don't have feedbacks on other screen sizes.

    On mobile, the left and right margins on the cards should be smaller so it can look closely similar to the sketch!

    Also the shadow in the cards should be reduced a little. You can do this by adjusting the spread of the shadow!

    Overall you did a good job with CSS Grid and you made proper use of Grid Span.

    I recommend you learn scss when you get comfortable with css, because it will help you write more maintainable and dry code.

    I see your class naming style is almost similar to BEM naming convention , you can check out BEM.... it is quite good for nesting similar classes when writing SCSS.

    Great work! 👍

    3
    Kristýna•40
    @KristynRihoPosted over 3 years ago

    @folathecoder Hello Folarin, thank you very much for your feedback!

    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