Design comparison
Solution retrospective
How to make the background bottom image be at the end of the page (in mobile view) ?
Community feedback
- @pikapikamartPosted over 3 years ago
Great work on this one. Regarding your query, what you could do is
- Make the body tag
position: relative
. - Instead of using
position: fixed
to your second background-image, useposition: absolute
that way, it will just stay at one part but not relative to the viewport. Use that instead ofposition: fixed
- It is now fixed, sorry adding a number 3 (:>). Also a suggestion, you could just omit or remove the
left
andright
style in your second background-image, since it is already styled withwidth: 100%
meaning take all width right.
Overall great job, layout seems resizes well^
0@MaryEhbPosted over 3 years ago@pikamart thanks π I tried number 1 and 2 but it looked broke so I stayed with fixed till I get a better solution so I think I will stay with number 3 now as well π€π Though I have an idea that I will try which is to put that image with the footer
0@pikapikamartPosted over 3 years ago@MaryEhb wait what? are you sure it is not working? hhaha in my end it is working good, the background stays at the end of the body tag, in the bottom. Are we referring to the same, the background image which is colored very light gray with this selector
.bg-img-bottom-mob
?0@MaryEhbPosted over 3 years ago@pikamart yes we are talking about the same thing it position the bottom image at the bottom of the screen not the bottom of the page if you know what I mean π I don't know how to explain it and I can't find a way to send you a screenshot about what I mean π Can you see it now anyway I think I fixed it by putting it in the footer in the html
0@pikapikamartPosted over 3 years ago@MaryEhb Hey yeah I got it but, did you update the website? I cant see the update that you made hahaha so I can't really see it by now. But i'm a bit confused right now hahaha but glad to know that you made it work^
0 - Make the body tag
- @RocTanweerPosted over 3 years ago
I don't understand about which background bottom image you are talking about...could you explain a bit clearly...?
By the way...great π work Keep it going and happy coding..!
0@MaryEhbPosted over 3 years ago@RocTanweer thank you π₯°
The background consist of two images (the one at the top left and the other one at the bottom right) My question was how to make the bottom one stick to the end of the page ? I got an idea to put it in the footer so I am gone try it out
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