Footer Issues

Ok, my site is finished and looks great but the Archive page and when you click on an item in the Archives page it messes up. Here are the links to both pages that I’m experiencing issues with.

http://david-mitchell.ca/wp/?page_id=21

http://david-mitchell.ca/wp/?cat=1

http://david-mitchell.ca/wp/?m=201001

You need to fix your HTML. I’ve run it through the validator and the rendering issues are very likely to be caused by your invalid markup.

On the first link above you have your footer inside .section which has 20px padding and therefore there is not enough room for the footer to fit full width.

Move the footer outside of .section.

e.g.


<h2>Monthly Archives</h2>
<ul/>
</div>
[B]</div>[/B]<!-- [B]extra closing tag added here and removed from after the footer[/B] -->
    [B]<div class="clear"></div>
[/B]

You can’t self close divs either.:slight_smile:

I haven’t checked the other pages but I would guess you have done the same so check first and then post back if not fixed (and as mentioned above validate the code also).

Hi, the problem with the 2 pages that are wrong, is that on the parent (for example this page) you set a class=“clearfix” and that sets tit to display:inline-block which shouldn’t be used! That part of the clearfix is for IE5 mac and noone uses that so go into the CSS file for the clearfix and remove that display:inline-block line

Validate also because I see multiple reused IDs in some pages :slight_smile:

Thanks Ryan, that definetly helped now I have to figure out why the footer isn’t in the correct spot on that page, I must have some padding somewhere which I don’t need.

Hi, I don’t know if you want the yellow part of the footer image showing, but if not you could set the left padding on “#posts” to 0.

If you do want some yellow, put some padding in, but decrease the width on “#bottomline” to match. Aka if you have 23px left padding on #hamilton, change teh width of #bottomline from 1023px, to 1000px., you will also need to remove width:100% from “#hamilton”.

If the width:100% there was for haslayout for IE6 give it zoom:1; or height:1% or some otherway to give it haslayout :).

Hey Ryan,

If I change the hamilton width then it screws up the homepage and other pages. I’ve been looking at this to see why this page

http://david-mitchell.ca/wp/?cat=1

The footer is off but everywhere else it is fine. Its ok due to the fact that nobody will be going to the cat=1 page but would be nice to get it to work all over and I noticed in IE the footer was still way up that taking out the clearfix did not work on that.

Thanks,

Mike

You should follow Pauls advice and move the footer out of the containing div that surrounds the columns. Fixing it as it currently is would be possible, but definately not hte best route :).