Skip to content
Submitted about 2 years ago

Responsive order summary component using Flexbox

Klara•270
@klara367
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Order summary component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

Hi everyone,

I would appreciate it if you could have a look at my code, especially on the responsive part. I set max-width to 375px and expected it to be changing with the width of the phone, but it's not. Could you give me some tips on how to fix this problem?

Thank you

Klara

Community feedback

  • Joseph Fola•590
    @Fola-JoePosted about 2 years ago

    Nice work here! I love it! I would recommend working on a mobile-first workflow before working on the media query for larger screen sizes. So I'd suggest setting .card {max-width: 375px;} and in your media query (min-width: 376px), you could increase the max-width. I hope this helps.

    Marked as helpful
    0
    Klara•270
    @klara367Posted about 2 years ago

    @Fola-Joe Thanks! I'll give it a try.

    1

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