Skip to content
Submitted over 4 years ago

Four card feature section master

Prasad Kudikala•180
@kpcprasad
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

I have used Grid Layout for desktop view and Flex for mobile view. I mainly focused on responsive design. Please provide suggestions on improving Grid, Flex and Responsiveness. I used Media queries to get responsiveness.

Community feedback

  • Matt Studdert•13,611
    @mattstuddertPosted over 4 years ago

    Nice work on this challenge! The way you've done the grid works really well. The only thing I'd recommend with your media queries is that you try using min-width media queries instead of max-width on a future project. It's quite a common workflow with front-end developers to use them and work mobile-first. It can often lead to less CSS code and has the benefit of loading in fewer styles for mobile users, which can be a nice performance gain.

    Keep it up!

    2
    Prasad Kudikala•180
    @kpcprasadPosted over 4 years ago

    Thanks you so much @mattstuddert . I will definitely follow your suggestions in my further challenges. :)

    1
    Matt Studdert•13,611
    @mattstuddertPosted over 4 years ago

    @kpcprasad you're welcome!

    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