Posicion absoluda en ie6

a_brillarmiamor · #1 (**permalink**) 26/06/2010, 14:24

Hola gente, tengo el sigueinte problema...

El tema es q la imagen me queda a la izquierda arriba en firefox y ie7 pegada al borde superior...pero en ie6 me baja aprox 15px sobre el eje y...como si le ubiera colocado un margin-top de 15px...alguna propiedad para arreglar esto?

Por cierto! estoy utilizando un sprite general grande pero eso no me genera problemas, ya arregle esa parte...XD...

aca el codigo html...

<div class="logo">
<img alt="MOUTA" title="MOUTA" src="/images/sprite_logo.png"/>
</div>

y el css...

.header .logo img {
clip:rect(0px, 890px, 179px, 553px);
left:-550px;
position:absolute;
}

cristian_cena · #2 (**permalink**) 26/06/2010, 14:42

hola, podes crear una hoja de estilos específica para ie6 y llamarla (<link>) con comentarios condicionales. Luego en esa hoja de estilos le das la distancia (top/right/left/bottom) que se adapte a tu necesidad.

Tene en cuenta que las distancias (desde el eje de coord. 0,0 esq. sup/izq) en una caja con posicion absoluta serán tomadas en base al primer ancestro relativo y si este no existe tomará como referencia al primer ancestro static, o sea <body>.

Espero te sirva, un saludo

a_brillarmiamor · #3 (**permalink**) 27/06/2010, 10:42

Cita:

Iniciado por cristian_cena

hola, podes crear una hoja de estilos específica para ie6 y llamarla (<link>) con[URL="http://www.disenorama.com/tutoriales/comentarios-condicionales-para-ie"] comentarios condicionales[/URL]. Luego en esa hoja de estilos le das la distancia (top/right/left/bottom) que se adapte a tu necesidad.

Tene en cuenta que las distancias (desde el eje de coord. 0,0 esq. sup/izq) en una caja con posicion absoluta serán tomadas en base al primer ancestro relativo y si este no existe tomará como referencia al primer ancestro static, o sea <body>.

Espero te sirva, un saludo

Grax cristian_cena x tu respuesta...
La idea es hacer solo una hoja de estilo para todos los navegadores y tengo entendido q se puede...
El tema es encontrar la propiedad adecuada para q coinsidan en ie 6 como en los demas...Cual es? la verdad lo ignoro e intente de todo ya, mas de una vez display: inline me soluciono las cosas pero este no es el caso... :( ...

a_brillarmiamor · #4 (**permalink**) 27/06/2010, 10:43

Cita:

Iniciado por cristian_cena

hola, podes crear una hoja de estilos específica para ie6 y llamarla (<link>) con[URL="http://www.disenorama.com/tutoriales/comentarios-condicionales-para-ie"] comentarios condicionales[/URL]. Luego en esa hoja de estilos le das la distancia (top/right/left/bottom) que se adapte a tu necesidad.

Tene en cuenta que las distancias (desde el eje de coord. 0,0 esq. sup/izq) en una caja con posicion absoluta serán tomadas en base al primer ancestro relativo y si este no existe tomará como referencia al primer ancestro static, o sea <body>.

Espero te sirva, un saludo

Grax cristian_cena x tu respuesta...
La idea es hacer solo una hoja de estilo para todos los navegadores y tengo entendido q se puede...
El tema es encontrar la propiedad adecuada para q coinsidan en ie 6 como en los demas...Cual es? la verdad lo ignoro e intente de todo ya, mas de una vez display: inline me soluciono las cosas pero este no es el caso... :( ...

cristian_cena · #5 (**permalink**) 27/06/2010, 22:35

Mira, la "propiedad adecuada" a mi entender no existe y hacer solo una hoja de estilos para todos los navegadores es posible mientras no te metas con internet explorer y su versión 6 (ya que podemos dar compatibilidad a ie8 para que funcione igual que ie7 con esta linea <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"/>)

Lo que puedes hacer es usar hacks para ie pero es una mala práctica puesto que no validará tu código además de que justo para evitar esto es que se usan los comentarios condicionales.

Te comento que cuando realizo una maquetación css siempre termino como mínimo con:
- un reset
- otro reset para IE que llamo con c. condicionales
- hoja de estilos para todos
- hoja de estilos para IE que llamo con c. condicionales (ya que uso el metatag que te muestro arriba sino debería hacer una hoja de estilos para ie7 y otra para ie8)
- hoja de estilo para IE6 que llamo con c. condicionales

Te puede ser útil interiorizarte con los bugs de ie.

Bueno, espero haberte sido de ayuda, mucha suerte pero ante todo mucha práctica, cualquier cosa ya sabes, puedes contar con mi humilde opinión. Un saludo

alexk · #6 (**permalink**) 27/06/2010, 23:00

a_brillarmiamor
como bien te indican no hay una propiedad magica para solucionar todos tus problemas... si queires una sola CSS deberias aprender primero, como funciona cada navegador, aun que siempre tendras variaciones de 1px mas o 1px menos, por mucho hack, o comentario condicional, o cualquier fix... es la realidad...
http://librosweb.es/
Yo suelo usar una hoja de estilos en general y una aparte para IE y en ella solo tengo un pequeño haslayout, pero muy util.
div, li{zoom:1;}
ya que no me valida, por eso la separo XD, pero si no requiero ie6, con una me vale.