Fri, 2010-02-19 14:43
hi everyone
I ma just about to go live with my site, www.thecarguru.co.za however I am having a css issue in my wordpress blog running on the site www.thecarguru.co.za/blog2/
it seams that my footer decides to display in the middle of my posts when viewed in full, this only happens in IE 7 and below, I have tried to figure out whats going on but I am at a loss
could anyone please have a look and possibly point out exactly how retarded I am being
thanks
Grant
Fri, 2010-02-19 16:37
#1
Id start by fixing your
Id start by fixing your validation errors
http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.thecarguru.co.za%2Fblog2%2F
Fri, 2010-02-19 17:47
#2
Grant, don't remove your arm,
Grant, don't remove your arm, that would be so untidy!
Validation may indeed help! Beyond that, whenever I see this type of thing, IE is a suspect based on the fact that it often must be told the height of things, or it will work unpredictably.
I do see a couple red flags to look at, although I don't see an easy fix. Liquid layouts, while laudable in principle, are not my specialty.
#main is floating, so in some circumstances IE will think it has no height. This is usually the scenario I see when IE is sticking something God-knows-where. (you also have "display: inline;" on this DIV, which I'm thinking is largely redundant in this scenario when you already have it floating.) Then again, you do have a clear near the bottom, and I would have thought it would have helped with getting the footer to look right.
I would suggest some flavor of the IE min-height hack for #main, but then #container has an explicit height, so this could get really messy. I even wonder if #container needs (or should have) explicit height.
At least you have a couple ideas to consider. Good luck!