CODEWITHSUNDEEP
htmlcssbackgroundbackground-image
Rob
Rob

Reputation: 6380

Full screen background doesn't allow for scrolling

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/

Upvotes: 0

Views: 1740

Answers (2)

Dave Haigh
Dave Haigh

Reputation: 4547

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

Upvotes: 1

Matthew Riches
Matthew Riches

Reputation: 2286

Set the image as a background instead of an actual image.

Then use the background-attachment property

W3C Background attachment guide

Upvotes: 1

Related Questions