Jump to content

footer troubles


Recommended Posts

okay, so the footer is supposed to be at the bottom of the page. The following code seems to work fine UNTIL the content pushes the page below the available window height. When that happens, the footer creeps up over the text at the bottom.


Just so you know, FireFox and Opera get it -- no problems. The problem surfaces in IE and Safari.


If I add a 99px pading to the bottom of the content area (which pushes the footer into place in IE and Safari), it creates 99px of extra whitespace in FireFox and Opera. What to do?


<style type="text/css">
#content {
#footer {
<div id="content">some content</div>
<div id="footer">footer content</div>


live example:


Link to comment
Share on other sites

no dice... I went ahead and used the old <!--[if IE 7]> hack to push the main content area down 104px and that fixes IE. Safari actually has a more complicated problem. Depending on how high the screen is in relation to the page, the footer moves (even when resizing the page manually with the mouse).


I don't know whether to call this a bug since IE pretty much duplicates Safari's occasional render. It's just weird.

Link to comment
Share on other sites

This thread is more than a year old. Are you sure you have something important to add to it?

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.