Question

I have a full screen background that is working when the window is resized but it’s stopped the ability to scroll when a page is longer than the window. It just cuts it off.

How can I keep the full screen background but allow the user to scroll when on a larger page?

This is the website I’m working on – http://www.uktinplate.com/v1/sales/

Answer 1

you need to add position: fixed to the background image element.

Then you need to take position: fixed off of mainContent and replace it with position: absolute

Then take the overflow: hidden style off of the wrapper element