2010-08-24 16 views
5

No puedo entender IE7 float right bug! Esto me está matando. Mi barra de NAV se ve muy bien en todas partes, excepto en IE7. Ya creé un IE7 CSS específico y he intentado varios enfoques, pero todavía no tuve éxito. link textFlotador: Derecho IE7 Error

Parece que el LI elementos están flotando fuera del #NAV dentro del .container.

Cualquiera de una solución IE7 para FLOAT:RIGHT?

Muchas gracias.

Aquí está mi código:

.container { 
    width: 983px; 
    margin: 0 auto; 
    background: fuchsia; 
} 
ul#nav { 
    height: 44px; 
    margin: 32px auto; 
    position: relative; 
} 
ul#nav li, ul#nav li a { 
    display: block; 
    height: 44px; 
    margin-left: 3px; 
    position: relative; 
} 
ul#nav li { 
    padding-left: 0; 
    height: 44px; 
    position: relative; 
    z-index: 10060; 
} 


<div class="container"> 
    <ul id="nav"> 
     <li><a class="navtop_7" href="#"></a></li> 
     <li><a class="navtop_6" href="#"></a></li> 
     <li><a class="navtop_5" href="#"></a></li> 
     <li><a class="navtop_4" href="#"></a></li> 
     <li><a class="navtop_3" href="#"></a></li> 
     <li><a class="navtop_2" href="#"></a></li> 
     <li><a class="navtop_1" href="#"></a></li> 
    </ul> 
</div> 

Respuesta

1

Este jsfiddle.net example muestra en IE7 la manera en que yo creo usted quiere que, basado en su descripción. (Para referencia futura, proporcione una imagen de referencia que esté intentando lograr).

.container { 
    width: 983px; 
    margin: 0 auto; 
    background: fuchsia; 
} 
ul#nav { 
    height: 44px; 
    margin: 32px auto; 
} 
ul#nav li { 
    display: block; 
    float: right; 
    background: green; 
    padding-left: 0; 
    width: 140px 
    height: 44px; 
} 
ul#nav li a { 
    background: blue; 
    display: block; 
    height: 44px; 
    width: 137px; 
    margin-left: 3px; 
}