Hi, i was working on the random quote machine challenge [link: https://codepen.io/tushar_/pen/BwvxVK]and it’s almost complete but i am facing a small issue. In mobile view, when the quote is long, the footer overlaps the content box. I’ve attached a sceenshot please give it a look.
This is happening because your footer is set to position: absolute; This means it doesnt respond to other elements getting in the way. Its staying in that spot no matter what margins you add to the quote container.
hint the absolute part.
As for the fix. Take a look at this codepen.
This is a “Always on the bottom” Fotter that isnt set to position: absolute; so if content pushes against it, the footer will move with the content.