MioMauro• 400
@MioMauro
Posted
Not perfect, but better @media only screen and (max-width: 1200px) { body { height: auto; flex-direction: column; padding: 0 50px; } body .container { display: flex; flex-direction: column; }
0
Design comparison
Solution retrospective
Still working on the mobile view. Don't know why it is not working. Anyone has a suggestion?
Community feedback
Tom• 290
@tomhine
Posted
Hi Claire, really nice job with the desktop view!
I noticed a couple of issues with your mobile view;
- You're setting your body element to
height: 100vh. This breaks on mobile because your card list height is much larger than this. I'd reset that on mobile. - You also need to change the body padding on mobile. Honestly i'd probably move this padding onto your main element.
- As for the mobile layout, I'd probably just swap to using flexbox with a colum direction and a gap.
Hope this helps 👍
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