Porque el Alto de Texto y Divs con ie7-ie8-ie9-Firefox se me vé mal?

gonzalosch · #1 (**permalink**) 13/08/2011, 06:44

Hola, tengo problemas para que un diseño me quede igual en todos los navegadores, analizando, creo que llegué a la cuestión del asunto,
El texto en Ie9 tiene un alto distinto que en ie8 y firefox.

Les armo un ejemplo para entender la situación:

Código:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <style type="text/css" >
    
body
{
    font-family: arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #626262;
}

*, S, td
{
    padding: 0;
    margin: 0;
    outline: 0;
}
    
    </style>
</head>
<body>
<div style="position:relative; top:10px; margin:auto; width:500px; height:100px; background-color:Aqua;  " >
<div style="background-color:Green ;">Texto Texto Texto</div>
<div style="background-color:Navy;">Otro Div, Otro Div</div>
</div>
</body>
</html>

Una imágen capturada de IE9, donde superpongo la misma área capturada de firefox y de los modos ie8 e ie7 (con internet explorer 9)

Imagen:

http://www.subirimagenes.com/imagen-ejemocss-6796372.html

Alguien me puede dar una mano con esto?
gracias.

Batan · #2 (**permalink**) 13/08/2011, 06:56

Hola muy buenas, con el ejemplo que diste no podemos solucionar mucho por que no hay ningun problema.

Pon tu código tal cual, intentando obviamente que sea lo más organizado posible y que se pueda entender; si es posible pon algunos comentarios.

Gracias, saludos.

gonzalosch · #3 (**permalink**) 13/08/2011, 07:04

Si que hay un problema, al menos para mí, y en el ejemplo se ve claramente.
fijate porfavor en la imágen que adjunté, en internet explorer 9 (la imágen de fondo) se ve como cada div con texto ocupa 1px menos de alto que en los otros browser (las otras imágenes superpuestas).

gonzalosch · #4 (**permalink**) 13/08/2011, 07:29

Cita:

Iniciado por Batan

Hola muy buenas, con el ejemplo que diste no podemos solucionar mucho por que no hay ningun problema.

Pon tu código tal cual, intentando obviamente que sea lo más organizado posible y que se pueda entender; si es posible pon algunos comentarios.

Gracias, saludos.

Si que hay un problema, al menos para mí, y en el ejemplo se ve claramente.
fijate porfavor en la imágen que adjunté, en internet explorer 9 (la imágen de fondo) se ve como cada div con texto ocupa 1px menos de alto que en los otros browser (las otras imágenes superpuestas).

Batan · #5 (**permalink**) 13/08/2011, 08:51

Te aseguro que al menos en mi navegador con IE9 se ve asi.
Y viendo en los demás navegadores, IE7 e IE8; se ve igual, sin problemas.
Y en mozilla... IGUAL

Saludos.

gonzalosch · #6 (**permalink**) 13/08/2011, 09:20

Cita:

Iniciado por Batan

Te aseguro que al menos en mi navegador con IE9 se ve asi.
Y viendo en los demás navegadores, IE7 e IE8; se ve igual, sin problemas.
Y en mozilla... IGUAL

Saludos.

capaz no me explico bien, te paso otra captura, parece igual, pero no es.

asegurate verlo en modo ie9 y no en modo compatibilidad.

gracias.