Design comparison
Solution retrospective
I had some difficulty with positioning the background image - the overview of the challenge mentions that the layout doesn't shift so it's great for those who haven't dived into responsive layouts yet. However I found that to get the background to work on multiple screen sizes I needed to use media queries. Is there another way to do this background image that I may have overlooked where media queries would not be needed? Or was I overthinking this challenge too much?
Community feedback
- @vanzasetiaPosted over 3 years ago
👋Hi Lisa Clark!
Coming from Slack, I have a better background-position:
background-position: right calc(47vw + 15%) bottom calc(65vh - 15vw), left calc(40vw + 25%) top calc(72vh - 15vw);This is not me who figured this out, I see the solution from @ApplePieGiraffe on this challenge and it works well without any
@mediaquery.That's it! Hopefully this is helpful!
Marked as helpful1@Lisa-C-27Posted over 3 years ago@vanzasetia Thanks, wow that really does work, would not have thought of those exact calculations
0 - Account deleted
This comment was deleted over 3 years ago
0@vanzasetiaPosted over 3 years ago@Nik-web12 How do you control the background position using flexbox?
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