Skip to content
Submitted 3 months ago

Seamless Responsive Layout with Flex and Positioning

PriyaSharma026•40
@PriyaSharma026
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

What are you most proud of, and what would you do differently next time?

I have designed this kind of layout for the first time and It made me think of how will I do that and what are the different approaches I can try? So I'm proud that I could design it.

What challenges did you encounter, and how did you overcome them?

Creating the layout for large devices as shown in the design was challenging for me. I first used grid but I couldn't make it using that and then I tried using flexbox , it was also a failure then I tried CSS positioning and flexbox together to make the design possible , it was also not easy but I finally did it.

What specific areas of your project would you like help with?

I would like help in the section where I have designed the four card layout for large size because I have use css flex and positioning . However , I want to know can we make it with different approach like using grid.

Community feedback

  • MikDra1•6,980
    @MikDra1Posted 3 months ago

    If you want to learn how to do this challange using grid I highly encourage you to watch this VIDEO which teaches you CSS grid but also uses this challenge.

    Hope you found this comment helpful 💗💗💗

    Good job and keep going 😁😊😉

    0
    PriyaSharma026•40
    @PriyaSharma026Posted 3 months ago

    @MikDra1 Thanks for the recommendation. It is definitely about grid but the challenge in that video is different .

    0
    MikDra1•6,980
    @MikDra1Posted 3 months ago

    @PriyaSharma026

    Sorry. Here is the VIDEO that I was talking about

    Marked as helpful
    1
    PriyaSharma026•40
    @PriyaSharma026Posted 3 months ago

    @MikDra1 Thanks a lot! It's really helpful. I'm surely gonna try that out.

    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