14/08/2004, 17:23
|
 | | | Fecha de Ingreso: julio-2004 Ubicación: Ciudad de México
Mensajes: 544
Antigüedad: 20 años, 4 meses Puntos: 2 | |
| Cada navegador asigna diferentes valores por defecto a determinadas propiedades CSS. Para asegurar un comportamiento similar debes asignar por tí mismo esos valores que se muestran diferentes. En tu caso es el padding y margin del body:
Una solución a tu problema podría ser esta:
<html>
<head>
<title>Prueba</title>
<style type="text/css">
body{
margin: 0px;
padding: 10px;
}
#a1{
border: solid 1px green;
margin: 0px;
width: 50px;
height: 100px;
}
#a2{
border: solid 1px red;
width: 50px;
position: absolute;
top: 111px;
}
</style>
</head>
<body>
<div id="a1">
Div 1
</div>
<div id="a2">
Div 2
</div>
</body>
</html>
Como podrás darte cuenta siguen sin ser identicos, pero la diferencia es de 2 pixeles. Esto se debe a que IE calcula mal el tamaño de las cajas. Al tamaño de la caja se le debe sumar el tamaño de los bordes, pero no lo hace, coloca los bordes dentro de la caja. Cambia el tamaño de los bordes en el ejemplo para que puedas notar lo que digo.
Intenta no ser dependiente del posicionamiento absoluto, ni usarlo en exceso. Al menos no si usas bordes. Si puedes colocar a las cajas en su lugar utilizando el natural fluir del contenido es mejor...
__________________ Mi pequeño espacio en la web: VisiónE
"El cosmos es todo lo que es, todo lo que fue, y todo lo que será alguna vez."
Última edición por KnowDemon; 14/08/2004 a las 17:31 |