issues w/ float? IE vs. FF problems

Discussion in 'CSS' started by natsirtm, Jun 1, 2006.

  1. #1
    I have nearly everything displaying relatively close in exactness.
    Except when I load a table listing of categories for a section in joomla.

    FF displays fine.. see below..
    [​IMG]

    IE wraps the mainbody content below the left navigation
    [​IMG]

    I have been doing a bunch of searching through css hacks, problems in IE, etc. but I haven't found any fix to this.

    any help would be much appreciated.

    CSS code below.
    
    /* // dummyproof: netxecute dummyproof template
       // PHP Licence Details
       // copyright: (C) www.netxecute.com
       // license: GNU/GPL License
       // by Tristan McKerracher
       // of netxecute
       // __ http://www.netxecute.com
       // Published 28 May 2006
    */
    
    body {
    	margin : 0; 
    	padding : 0; 
    	text-align : center;
    	font-size: 77%;
    	font-family : "Lucida Grande","Lucida Sans Unicode",geneva,arial,verdana,sans-serif; 
    	background : white; 
    }
    
    /* START SITE & DIV STYLES */
    /* Used for layout of the SiteArea container div */
    #SiteArea {
    
    }
    /* Used for layout of the SiteContent container div */
    #SiteContent {
    	width: 1024px;
    	margin-left: auto;
    	margin-right: auto;
    }
    
    /* START HEADER & POSITION STYLES */
    /* Used for layout of the Header container div
    Child of SiteArea/SiteContent */
    #Header {
    	height: 250px;
    }
    /* Used for layout of the icon position (ie. logo)
    Child of Header */
    #Icon {
    	float: left;
    }
    /* Used for layout of the top position (ie. rightside of header)
    Child of Header */
    div>#TOP {
    	width: 40%;
    	margin-left: 55%;
    }
    #Top {
    	height: 250px;
    	margin-left: 50%;
    	width: 80%;
    }
    /* END HEADER & POSITION STYLES */
    
    /* START CONTENT & POSITION STYLES */
    /* Used for layout of the Content container div
    Child of SiteArea/SiteContent */
    #Content {
    	border-top: 10px solid #000000;
    	border-right: 10px solid #000000;
    	max-width: 760px;
    }
    /* Used for layout of the user5 position
    Child of Left */
    #User5 {
    	
    }
    /* Used for layout of the left position
    Child of Content */
    #Left {
    	float: left;
    }
    /* Used for layout of the user4 position
    Child of Left */
    #User4 {
    	
    }
    /* Used for layout of the advert2 position
    Child of Left */
    #Advert2 {
    	
    }
    
    /* Used to highlight various small bits of text */
    .redtext {
    	color: #FF0000;
    }
    /* Used for layout of the MainBody div
    Child of Content */
    #MainBody {
    
    }
    /* Used for layout of the user1 position
    Child of MainBody */
    div>#User1 {
    	margin-left: 45%
    }
    #User1 {
    	text-align: left;
    	margin-left: 10%;
    	float: left;
    }
    /* Used for layout of the user2 position
    Child of MainBody */
    div>#User2 {
    	margin-left: 0%;
    	margin-top: 0%;
    }
    #User2 {
    	text-align: left;
    	margin-left: 80%;
    	margin-top: -18%;
    }
    
    /* Used for layout of the right position
    Child of Content */
    div>#Right {
    	width: 20%;
    }
    #Right {
    	width: 100%;
    	margin-left: 80%;
    	vertical-align: top;
    }
    /* Used for layout of the advert3 position
    Child of Right */
    #Advert3 {
    	
    }
    /* END CONTENT & POSITION STYLES */
    
    /* START FOOTER & POSITION STYLES */
    /* Used for layout of the Footer container div
    Child of SiteArea/SiteContent */
    #Footer {
    	clear: both;
    	background-color: #7B9ECE;
    }
    /* Used for layout of the user3 position
    Child of Footer */
    #User3 {
    
    }
    ul#mainlevel-ftrmenu {
      list-style: none;
      padding: 0;
      margin: 0;
    }
    ul#mainlevel-ftrmenu li {
      background-image: none;
      padding-left: 0px;
      padding-right: 0px;
      margin: 0;
      float: left;
      font-size: 1em;
      white-space: nowrap;
    }
    ul#mainlevel-ftrmenu li a {
      display: block;
      padding-left: 15px;
      padding-right: 15px;
      text-decoration: underline;
      color: #B5CAE7;
    }
    ul#mainlevel-ftrmenu li a:hover {
      text-decoration: none;
      color: #FF0000;
    }
    
    /* Used for layout of the Designer div
    Child of Footer */
    #Designer {
    
    }
    /* Used for layout of the Copyright div
    Child of Footer */
    #Copyright {
    
    }
    /* Used for layout of the advert1 position (ie. header center)
    Child of Footer */
    #Advert1 {
    
    }
    /* END FOOTER & POSITION STYLES */
    
    /* START JOOMLA STYLES */
    
    /* Used for presentation of all module containers */
    .moduletable {
    	width: 100%;
    }
    .moduletable h3 {
    	font-size: 1.2em;
    	font-weight: bold;
    	text-transform: uppercase;
    	text-align: left;
    	text-indent: 8px;
    	letter-spacing: 1px;
    	color: #7B9ECE;
    }
    .moduletable td {
    	padding: 0 0 0 0;
    	margin: 4px;
    }
    
    /* Used for presentation of all the user3 module position */
    div.moduletable-ftrmenu {
    	margin-left: auto;
    	margin-right: auto;
    }
    .componentheading {
    	text-align: left;
    	font-size: 2em;
    	font-style: italic;
    	color: #7B9ECE;
    }
    .contentheading {
    	text-align: left;
    	font-size: 2em;
    	font-style: italic;
    	color: #7B9ECE;
    }
    
    Code (markup):
     
    natsirtm, Jun 1, 2006 IP