Footer overlapping content

Question

Thanks for you're help.

You can view this online

The problem is my footer. It won't seem to stay below the content. I attempted to use Matthew James Taylor's method which is not working for me. I need the footer to stay below the content when the content fills the page, and stay at the bottom of the window when the content does not fill the page (sticky footer). I'm seeking a non-JS solution.

Thanks again.

Headshota · Accepted Answer · 2011-03-29T12:41:15.787

2

put an empty div element at the end of .container element with clear:both; like this

<div style="clear:both;"></div>

And remove height from #tabs element. you have set it as height: 500px;

edited Mar 29 '11 at 12:41

answered Mar 29 '11 at 12:35

Headshota

21,021
11
61
82

@Shota inside the end of the container or right after the container? – SSHUC Mar 29 '11 at 12:39
inside the container and remove the height from `#tabs` element. – Headshota Mar 29 '11 at 12:40
@Shota I've placed the clearing DIV, but the #tabs height is being written by a javascript. How do I remove that, and will it have a negative affect on the tabs? – SSHUC Mar 29 '11 at 12:45
I've removed height with firebug and footer got to it's place. try it. – Headshota Mar 29 '11 at 12:46
@Shota Wow, yeah. But, I have no idea how to remove the height in the JS file. I'll update my post with the code. If you have any idea, please let me know. – SSHUC Mar 29 '11 at 12:50
@Shota, Wait, I think the height is on the .content. – SSHUC Mar 29 '11 at 12:53
as I see the height is set in m.css file on line 106 – Headshota Mar 29 '11 at 12:53
@Shota Yeah, it was the .contents DIV. Thanks a lot for your help! – SSHUC Mar 29 '11 at 12:56

Footer overlapping content

1 Answers1