Skip to content
Submitted about 2 years ago

Responsive Four Card Feature Section using CSS Grid and Flex-Box

Nenkimwa Kangdim•90
@Fanuel369
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

Any tips to improve my design ?

Community feedback

  • Aatypic•490
    @AatypicPosted about 2 years ago

    Hello and congratulations on your solution, it's looking good !

    To match better the design and readability you could change the font-weight of the <p> 's under the header and inside the cards, I think everyone finds it hard to read.

    You could also try and remove the tiny scrolling you have.

    After checking your code it has to do with your spacings. E.g. your <body> has a default margin on it for that you need a margin: 0 in order to remove the default value. You can also add a min-height: 100vh. Those are actually resets you can find more about here https://piccalil.li/blog/a-modern-css-reset/

    Good luck ✌️

    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