Responsive landing page with flex box and media queries
Design comparison
Solution retrospective
I fond difficult while building responsive layouts
Community feedback
- @correlucasPosted about 2 years ago
πΎHello Mal Thidar, congratulations for your first solution! π Welcome to the Frontend Mentor Coding Community!
Your solution is almost fully responsive by what I saw, something you need to fix is the image that gets distorted while the component scales down with the screen. See how you fix it below:
Make all the images inside the container scaling and respecting the size of the container, you need to add
max-width: 100%
and add alsoobject-fit: cover
to make the image auto-crop when resizing inside the column:img { display: block; object-fit: cover; max-width: 100%; }
βοΈ I hope this helps you and happy coding!
Marked as helpful0
Please log in to post a comment
Log in with GitHubJoin 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