Grow your CSS skills. Land your dream job.

Internet Explorer 8 Problem

  • # October 16, 2009 at 7:35 am

    Hello friends,

    I am having this footer problem only in IE8. I think this problem is related to float. I have cleared all the floats and still the footer is coming over the page wrap as seen in this image

    [img]http://i36.tinypic.com/166mydj.jpg[/img]

    Here is the link to the site: http://www.code-pal.com

    It’s been irritating me for quite some time now. I fixed it when I first discovered it but then it came back again like a ghost to haunt me lol.. Can anyone please look at it and suggest me whats the problem? The footer is absolutely fine I guess because its loading fine even in IE6 :| [not the whole site though.. haven't fixed it for ie 6 yet]

    Thank You,

    ~Sumeet Chawla

    # October 16, 2009 at 8:03 am

    Code? Or, better still, a link please.

    I’m getting old and my psychic powers don’t work so well any more :?. I need more than a picture to troubleshoot from.

    EDIT:
    Sorry, just realised it’s your own site. Checked in IENetRenderer and it looks ok to me http://ipinfo.info/netrenderer/index.php?browser=ie8&url=http://www.code-pal.com/

    # October 16, 2009 at 1:52 pm

    Thank you for replying, apostrophe.. Sorry I didn’t supply a proper link, my bad :|

    But thats weird that it rendered properly in IENetRenderer.. Cos actually one of my friends pointed it out to me that its not loading properly in ie8 and then i rechecked it on IETester and it got messed up as in the pic above… Can a site do like that? lol I mean render properly at one place and mess up at another place with in the same browser :?:

    # October 16, 2009 at 2:08 pm
    "Sumeet Chawla" wrote:
    Can a site do like that? lol I mean render properly at one place and mess up at another place with in the same browser :?:

    That’s definitely wierd. I’m on a Mac so it’s hard to check right now. Different OS’s perhaps? Maybe there is a difference between ie8 in XP and vista?

    For what it’s worth, your code looks fine and I don’t see any reason why the footer wouldn’t stay in place.

    Oh, and don’t worry about the link, like I said I’m getting old :oops:

    # October 16, 2009 at 2:48 pm

    Yea thats what;s been irritating me.. I rechecked my code over and over again and nothing looked wrong to cause that kind of an error.. But I found the error 2 times on IE8 and everytime when ever i check on IETester’s ie8 :| Maybe anyone having IE8 can confirm it again for me? :P

    Haha you are not getting old.. I have become careless lol

    # October 18, 2009 at 3:34 pm

    Hello,

    It is due to not proper spacing in CSS I guess you need to fixed that up..

    # October 19, 2009 at 1:01 pm

    Hello,
    Not proper spacing in the CSS as in?

    Thanks

    # October 19, 2009 at 1:22 pm

    The only thing I can see is that when I run the page through the validator http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.code-pal.com%2F the errors shown relate mostly to this line:

    Code:

    Maybe that missing closing slash is causing a chain reaction all the way down to the footer in ie8. It certainly won’t do any harm to put it in there.

    Code:
    # October 19, 2009 at 1:31 pm

    @Apostrophe: Thanks for the missing slash error.. I recently uploaded a favicon and totally forgot to re-validate the site after that. But I don’t think the problem is because of that.. I discovered the problem even before making a favicon for the website :|

    # October 19, 2009 at 2:37 pm
    "Sumeet Chawla" wrote:
    @Apostrophe: Thanks for the missing slash error.. I recently uploaded a favicon and totally forgot to re-validate the site after that. But I don’t think the problem is because of that.. I discovered the problem even before making a favicon for the website :|

    Oh well, it was a bit of a long shot. :?

    How about this. Instead of having the clear div here:

    Code:

    Why not have it after you have closed #page-wrap?

    Code:
    # October 19, 2009 at 2:40 pm

    yup.. tried that too lol.. the first time when i had the problem I checked and rechecked all the floats and clears to confirm if I was missing some where.. Then in the end I just got tired and gave a clear just before the start of the footer… i.e. in the index.php file of wordpress right before where the footer is being called.. :|

    # October 19, 2009 at 3:21 pm

    That’s my point. It is not before the start of the footer, there are at least 3 closing divs between it and the footer. It should be between the page-wrap and the footer.

    # October 19, 2009 at 3:46 pm

    yup.. I did that only..
    Page wrap ends
    clear dive
    footer starts :)

    Code:
    < ?php get_header(); ?>

    < ?php include (TEMPLATEPATH . "/....php"); ?>

    Hi, we convert your beautiful designs into semantically valid and totally rocking code. We are Codepal!

    < ?php include (TEMPLATEPATH . "/....php"); ?>
    < ?php include (TEMPLATEPATH . "/l....php");?>

    < ?php get_footer(); ?>

    Anyway, I did it again to recheck it right now and still the same overlapping error in IETester :| :(

    oooo… I just discovered a very weird thing.. When I load the site in IE8, it comes over lapped as shown in the image I posted. But then if I left click and select some of the white text which is visible just above the over lapping footer… The site becomes normal agian! :| without even a refresh!! Geez.. am going to go nuts with this one lol

    # October 29, 2009 at 10:21 am

    Hi there,

    I am having a very simillair problem in IE8 only and it’s driving me nuts.
    I just signed up here to post since this thread might find a solution.

    First of I have the same problem with your site on IE8 (VIsta)

    I’m also having the problem on my clients page on http://www.bodymindwisdom.com/back-jack-chairs/
    you can browse the different product pages and should see it there as well. (not always)

    Strange thing is text an images do not always overlap, and when reloaded it disappears. Also when clicked on the overlapped text or select some of it. the page jumps into place.

    I don’t have that much CSS in it. It’s a table based layout. The text however is formatted with CSS.
    The only thing I found we have in common, we both have form tags. You for you search form and me for the cart.

    I appreciate any help of ourse and will elt you know once I found a solution.

    Tino

    # October 29, 2009 at 10:35 am

    http://wosbee.com/node/1680

    that might be a solution

    Tino

Viewing 15 posts - 1 through 15 (of 16 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".