Q:

CSS - Fix an element at the very bottom of page for left/right horizontal scrolling 

I have a website scrolling horizontally using this script: 
http://tympanus.net/Tutorials/WebsiteScrolling/index.html 
Sometimes with this build I end up with a vertical scrollbar because, depending on the user's resolution, the copy may run further down the visible portion of the page.
I have a bit of footer information that I want to scroll along with the page horizontally, but I want it to always be at the VERY bottom of the page if there is a scrollbar, not just the window.  Using this CSS:
.footer { position: fixed; bottom: 10px; left: 100px; } 

Doesn't do what I want because the footer will overlay the site's copy.
So I also tried something like this:
html, body { min-height: 900px; } 
.footer { position: fixed; top: 880px; left: 100px; }

Which also didn't work because the information was still always pushed off the visible portion of the page.
So I'm looking for a solution to essentially let the footer information lay wherever it naturally falls on the page, but always fixed 100px from the left as the page scrolls horizontally.
Thanks for any help!

A:

I'm not sure you can do this entirely with CSS. I would make a javascript (or jquery) function that detects the size of the content div (or body) and positions your footer div after it (with offset if you're using jquery, or by manipulating the top margin if not). Then you can use the .scroll method on the window to move the div's horizontal position when a user scrolls to the right.

