Background image and scrolling

[dgrenier]

Hey guys, I'm having trouble with the development of our company's website. I tried various things to fix it, but there's nothing that I know of that'll work.

Basically, it seems that the background height of the central part of my layout is set for the page height, but don't stick once you start to scroll. Sorry, my english isn't good enough to describe it in a more meaningful way.

The problem is apparent on every page, but is the most visible here:

http://www.lumenilux.com/faq/

Everything is set via a CSS sheet and has started when I implemented the footer that stick to the bottom of the page - or the window, whichever is the longest.

Anybody has already seen this?

 

[angelwatt]

If you remove the height: 100% from the html selector (and maybe the body selector) it gets rid of the issue I believe, at least if I'm interpreting the problem correctly. Your pages seem decently long so you likely don't need to fix the footer to the bottom of the page.

 

[dgrenier]

If you remove the height: 100% from the html selector (and maybe the body selector) it gets rid of the issue I believe, at least if I'm interpreting the problem correctly. Your pages seem decently long so you likely don't need to fix the footer to the bottom of the page.

I tried that already, and what it does is stretch the whole central part to the content height, not the window. Might look ok on smaller screen, but as soon as you go on bigger screens, or if I don't have much content in a page, it gets pretty ugly.

I have a plan B that could work, but I'd really like to find a way to make this work the way it is as it is really the look we're going after.

 

[dgrenier]

I managed to find a way to achieve what I was looking for. It required to add yet another div, but it worked. I moved the background-image from the body tag, to this "container" tag, and everything worked well.