DIV Attached to Bottom of Viewport

If you're trying to attach something to the bottom of the browser window and keep it there, perhaps you might be interested in the CSS position: attribute?

http://www.w3schools.com/Css/css_positioning.asp

Specifically, position: fixed; and then specify bottom: 0; to attach the bottom of something to the bottom of the browser.

I think you're going to run into problems if you try to specify a height on your upper div. It gets complicated and messy to do it this way.

Try this:

On your upper content div, don't set a height; but do set bottom-padding to 100px, or some over value that allows for the bottom div to display its full content without overlapping. This way, your main content will flow normally, and take up just as much space as it needs, but it won't be interfered with by the bottom div.