Ian Gibson wrote: > Hi all > > Was inspired by this list to try out the sticky footer technique in my > dotnetnuke skin. However, the generated form tags cause the footer to > remain stuck when the browser is resized smaller, causing the footer to > overlap content text > > Here without form tags (stuck nicely)... > http://demo.jo-informatik.dk/test1.htm > > Here without form tags (overly stuck)... > http://demo.jo-informatik.dk/test2.htm > > I know the standard fix is to set a height:100% on the form element, but > it doesn't seem to work for me :( >
Here's the method I use, which uses an outer DIV of min-height: 100%, not height: 100%; http://www.cssstickyfooter.com/ Your first example has an extra DIV at the top of the page. As it contains hidden INPUTs, the height is zero and does not affect the rest of the page, which more or less follows the above method. In your second example, you wrapped the entire content in your FORM, including the footer. You really need to wrap all content except for the footer inside your container DIV, giving _that_ the min-height of 100%. Cordially, David -- ______________________________________________________________________ css-discuss [[email protected]] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
