Grow your CSS skills. Land your dream job.

[Solved] Ie6 makes content from nowhere, how to fix it?

  • # June 19, 2009 at 10:06 am

    Hello,

    Im am working on a project. I saw that IE6 started to make the content from nowhere. I type <h2>What you should know about contact lenses</h2> in the xhtml, but he displays: What you should know about contact lenses lenses. Firefox and all other normal (sorry IE) browsers displays it normally like it should be. I have been managing this bug not the first time. Some times the fake text disappears when I add a news division like <div class="fixie6"></div> witch does completely nothing and it fix the bug, but am tired of adding like 5 divisions witch does completely nothing, so I’m looking for help. I have noticed that this bug appears only when I add a box (div or etc) and float it (in my page it is div#items) and when I add lot of more floated divs in it (div#items div.item). Then the ie6 starts to bug the content and make it from nowhere. I hope that anyone will know how to deal with that, because it really make me mad :evil: .

    [attachment=1]Ie6lenses.jpg[/attachment]

    [attachment=0]fflenses.jpg[/attachment]

    Here is the web page link: LINK DELETED

    Here is the code that I think (maybe it is not) makes this bug:

    (I believe that it is something about the css, because when I remove style IE6 works OK with that)

    Code:
    #items {float:left; width:741px; display:inline; margin-top:13px; margin-left:6px;}
    .item {float:left; width:163px; height:227px; padding:0 12px 16px 9px; background: url(images/item-bg.gif) bottom right no-repeat; position:relative;}
    #items .last {background:url(images/item-last-bg.gif) bottom left no-repeat;}
    .item .img {width:100%; height:105px; display:table; }
    .item .img p {display:table-cell; vertical-align:middle; text-align:center;}
    .item .img p a img {border:none;}
    .item h4 a {font-size:11px; margin-bottom:6px; float:left;}
    .item p.iabout {float:left; line-height:14px;}
    .item a.more {position:absolute; bottom:16px; right:13px; background:url(images/item-a-more-bg.gif) no-repeat; height:32px; width:59px; color:#FFF; outline:none;}
    .item a.more span {margin-top:2px; float:left; width:100%; text-align:center;}
    .item p.price {position:absolute; bottom:16px; left:13px;}
    .item p.price strong {font-size:18px; color:#3892a5;}
    .item p.price span {text-decoration:line-through;}
    #items a#all_stock {float:right; background:url(images/a-all_stock-bg.gif) left center no-repeat; padding-left:12px; font-weight:bold; margin-right:16px; display:inline; margin-top:7px;}

    xHTML:

    Code:

    Focus Dailies All day Comfort

    30 unit package. Biocompatible contact lens with a moisturizing effect. Svehust oychivost to dehydration..

    Find out more

    £7.87
    was £7.99

    Focus Dailies All day Comfort

    30 unit package. Biocompatible contact lens with a moisturizing effect. Svehust oychivost to dehydration..

    Find out more

    £7.87
    was £7.99

    Focus Dailies All day Comfort

    30 unit package. Biocompatible contact lens with a moisturizing effect. Svehust oychivost to dehydration..

    Find out more

    £7.87
    was £7.99

    Focus Dailies All day Comfort

    30 unit package. Biocompatible contact lens with a moisturizing effect. Svehust oychivost to dehydration..

    Find out more

    £7.87
    was £7.99

    Focus Dailies All day Comfort

    30 unit package. Biocompatible contact lens with a moisturizing effect. Svehust oychivost to dehydration..

    Find out more

    £7.87
    was £7.99

    Focus Dailies All day Comfort

    30 unit package. Biocompatible contact lens with a moisturizing effect. Svehust oychivost to dehydration..

    Find out more

    £7.87
    was £7.99

    Focus Dailies All day Comfort

    30 unit package. Biocompatible contact lens with a moisturizing effect. Svehust oychivost to dehydration..

    Find out more

    £7.87
    was £7.99

    Focus Dailies All day Comfort

    30 unit package. Biocompatible contact lens with a moisturizing effect. Svehust oychivost to dehydration..

    Find out more

    £7.87
    was £7.99

    Click here to see all our stock

    Thanks for providing solutions.

    # June 19, 2009 at 10:42 am

    I’ve never come across this bug but I’ve done a quick search and it looks like your comments are causing the problem. Try putting the comments before the closing div.
    eg.

    Code:
    # June 19, 2009 at 10:51 am
    "apostrophe" wrote:
    I’ve never come across this bug but I’ve done a quick search and it looks like your comments are causing the problem. Try putting the comments before the closing div.
    eg.

    Code:

    OMG, you are right! How you came up with that idea? THANK YOU

    P.S. Now I will need to change my beautiful comment style :|

    # June 19, 2009 at 3:44 pm

    This is one of my favourite IE6 bugs ever, makes absolutely zero sense haha. I remember when I first had to deal with it, so confusing. Fortunately, once you know what it is, it’s easy to avoid in the future.

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.

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