Html & CSS only. Made use of Flexbox and CSS Grid.
Design comparison
Solution retrospective
I struggled a bit to make my footer background image respond to different screen sizes.
Please review my code and let me know if you have a better way to do it.
Thanks
Community feedback
- @RMK-creativePosted over 3 years ago
Hi Bulumko, you could try adding a background-position to it - try it out and see which one works :)
1 - @oFredericPosted over 3 years ago
Hello,
For this very example, you could create a div that would contain the footer and inside that container, you can fit an image with the following CSS to make that image reactive =>
img { width: 100%; height: inherit; object-fit: cover; }
Keep this block of code somewhere, you will use it a lot.
PS: the inherit is only if you do a position: absolute; otherwise you can do 100%.
0
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