Hi,

I am trying to get rid of this vertical scroll bar on my site: http://mark.van-hussen.nl/

It appears since I’ve set the height of the body and the main div to 100% trying to fill out the screen.

Thanks,

Mark

The basic method for a Sticky Footer Layout is setting min-height:100% on your main containing div after you set height:100% on the body & html elements. That allows the main divs BG color to expand with content.

The footer div then sits outside of the main containing div and is pulled back into the wrapper with a negative top margin or you pull the wrapper through the screen with a negative top margin and leave the footer as is. The footer needs to be a fixed height and the negative top margin (either on the footer or the wrapper) should match the footer’s height. That is what your layout did not take into account.

http://www.pmob.co.uk/temp/sticky-footer-ie8new.htm
http://www.pmob.co.uk/temp/sticky-f.htm
http://www.css-lab.com/demos/stickfoot/stickfoot-1.html
http://www.css-lab.com/demos/stickfoot/stickfoot-2.html

Thanks! Very useful.

Mark

A new problem arose: a vertical scroll bar keep on displaying even though there is nothing to scroll…

http://www.dzl-groep.nl/

Thanks

Nevermind, found the fix: added fix width.

I tried to use this with flag confirmation forms with this website but it does not work, how to do?
—————————————————————————
sajoo

@hussen your website doesnt work anymore.
@lananhhoang2010 what?

The range property of the scrollbar is a list of two integers: for example, (0 100). The value of the scrollbar determines the position of the scrollbox along the length of the scrollbar. The value of the scrollbar is an integer within the range.

Try that:

Depending on browser compatibility you might try these rules
overflow: -moz-scrollbars-vertical;
overflow-y: scroll;

So, what was the final solution?



iPhone Cases | iPad Case