ConnorMiddleton.com

I never knew this was possible and would have argued against the fact it can... until today. This code never made it to production so it could well have been a glitch on my entire setup, but I wanted to put this out here as a reminder to myself and help for others.

Here is the suspect CSS:

/***************************************
** Report Styles
*****************************************/
   
    #report {list-style-type:none;list-style-image:none;}
    #report ul{float:left;}
    #report li{float:left;background:none;_width:auto;}
    #report li.level1{border-bottom:0px;width:670px;float:left;overflow:hidden;}
    #report li.totalRow{font-weight:bold;color:#007161;border-bottom:0px;}
    #report .handle{float:left;}
   
    #report .dataElement{border-bottom:float:left;1px dashed silver;text-align:left;width:580px;}
    #report .dataLevel2{width:530px;}
    #report .dataLevel3{width:480px;}
    #report .dataLevel4{width:430px;}
    #report .datalevel5{width:380px;}

    #report .totalDataElement{float:left;text-align:right;width:592px;}
    #report    .totalElement{float:left;text-align:right;width:50px;}
    #report .totalRow{width:670px;}
   
    /************************************************
    **** Styles for Associate Detail Report **
    *************************************************/
    #peerRecBrowseCol {}
    #peerRecBrowseCol .peerRec {width:100%;float:left;}
    #peerRecBrowseCol .peerRec .toLine{font-weight:bold;color:007161;}
    #peerRecBrowseCol .peerRec .fromLine{text-align:right;}
    #peerRecBrowseCol .peerRec .sentOnLine{text-align:right;}
    #peerRecBrowseCol .peerRec .peerRecBody{width:100%;margin-left:10px;}
    #peerRecBrowseCol .peerRecDivider {height:1px;border:1px dashed silver;width:60%; margin-bottom:10px}
    #peerRecBrowseCol .private {color:red !important}
    #peerRecBrowseCol .private .toLine{color:red !important}
/******* End Styles for Reports form *********/

Doesn't look to bad really does it?

The Culprit was the three simple float:left's. How is it that IE chokes on those extra floats in there? What did I do wrong? Why is it happening?

update: Seems I'm not the only one who ha seen this problem. I wonder if these are all related? And I wonder why I never ran across this before?

http://meyerweb.com/eric/thoughts/2004/09/16/when-browsers-attack/ 2004 seriously?

http://raven-seo-tools.com/blog/2675/crash-ie6-with-only-css OK 2006 isn't too bad...wait that is still 4 freaking years ago!