margin-bottom doble en IE6

[WinderJerter]

Hola que tal, les cuento; hoy encontre un error en IE6 en mi web cuando la estaba revisando en ese navegador y el problema es que el margin-bottom que tiene es de 4px y en IE6 sale mas grande de lo normal; le calculo que es el doble

Aqui el codigo css:

Código CSS:

.share ul {
    list-style:none;
}
 
.share ul li {
    margin-bottom: 4px;
}
 
.share ul li a {
    color: #848484;
    display: block;
    font-size: 10px;
    line-height: 32px;
    padding: 0 0 0 40px;
    text-decoration: none;
}
 
.share ul li a {
    background: url("images/share-icons.png") no-repeat;
}
 
.share ul li a.facebook {
    background-position: 0 0;
}
 
.share ul li a.twitter {
    background-position: 0 -32px;
}
 

Alguien sabe porque pasa esto y si me pueden ayudar a solucionarlo se los agradeceria mucho

Saludos y gracias de antemano

[Naahuel]

Yo he probado ese código y otras alternativas y no veo problemas. Nunca me pasó eso tampoco. Has intentado resteando los estilos del navegador? margin:0, padding:0, line-height:normal y cosas así.

[ZoroRoronoa]

en IE6 aparecen problemas como estos.
el doble margin y/o padding, el problema con los PNG, etc...

Mis alternativas han sido usando un script javascript que hace que IE6 y IE7, se comporten como IE8 y soluciona estos problemas que te he mencionado.

U otra alternativa es usar hacks exclusivos para IE6 y darle un margin menor, tratardo, que quede igual al margin original.

Y por ultimo, usando la misma alternativa de ponerle un padding menor exclusivo para IE6, pero "SIN USAR HACKS" (para que valide), uso una hoja de estilos diferente para IE6.

Saludos.

[cristian_cena]

es común que aparezcan diferencias en las versiones de ie aún trabajando con medidas exactas.
La lectura de este hilo en donde se presentan varias soluciones te puede ser de utilidad.
El usuario kseso? muestra como a traves de comentarios condicionales puedes usar hacks solo para ie y con ello validar ante la w3c.
algo así estará bien...

Código CSS:

<!--[if IE 6]>
<link rel="stylesheet" href="css/IE6.css" />
<![endif]-->
 

Yo muestro dos alternativas, una basada en javascript y otra basada en php. Tu elijes.
Estos metatags te serán útiles para trabajar con las vistas de compatibilidad de ie.

ZoroRoronoa, ¿podrías compartir el script que transforma a ie6 en ie8?

Saludos.

[WinderJerter]

okey muchas gracias a todos por responder, entonces si no es por problema o por falta de alguna propiedad de css esta bien al fin de cuantas no se deforma el diseño solo era para que se vieran iguales en todos los navegadores.

Iniciado por cristian_cena

ZoroRoronoa, ¿podrías compartir el script que transforma a ie6 en ie8?

Saludos.

Saludos y muchas gracias

[ZoroRoronoa]

@cristian_cena

Compatible con IE8 (para IE7 Y IE6)

Código HTML:

<!--[if lt IE 8]>
    <script src="http://ie7-js.googlecode.com/svn/version/2.0(beta3)/IE8.js" type="text/javascript"></script>
    <![endif]-->
 

Compatible con IE7 (para IE5 Y IE6)

Código HTML:

<!--[if lt IE 7]>
    <script src="http://ie7-js.googlecode.com/svn/version/2.0(beta3)/IE7.js" type="text/javascript"></script>
    <![endif]-->
 

*corrige los PNGs transparentes y elimina el doble margen/padding que se aplica cuando los divs están flotando a la izquierda.

NOTA ADICIONAL:
Para que funcione lo de los PNG transparentes, todas las imagenes debes ponerles un nombre que terminen en: -trans

ejemplo:

bg-trans.png
image1-trans.png
logo-trans.png

etc...


Saludos

[cristian_cena]

Gracias zoro.