Hola comunidad:
¿Alguien podría explicar a su sobrinito de seis años como funciona la propiedad position aplicada a etiquetas div. Teniendo en cuenta que trabajamos con la unidad de medida em ... y como lograr que el css se vea igual en los navegadores: opera, safari firefox y explorer (en sus más despiadadas versiones)?
Saludo cordialmente luego de haber sido marcado por la frustrante experiencia del fuckyou IE.
Gracias
P/D: origen de la pregunta
<style type="text/css">
*{margin:0; padding:0;}
body {
background-color: #CCCCCC;
font-size:0.75em;
letter-spacing: normal;
text-align: left;
word-spacing: normal;
font-family: Arial, Helvetica, sans-serif;
font-style: normal;
line-height: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
}
#menu_fijo {
position:fixed;
background-color: #3399CC;
width:48.00em;
height:10em;
margin:auto;
height:25em;
padding:1em;
color:#FFFFFF;
}
#content {
background-color: #FFFFFF;
color: #666666;
width: 50.00em;
margin:auto;
}
#header {
width: 48.00em;
height:2.50em;
background-color:#666666;
color:#FFFFFF;
padding:1em;
}
#left {
width:10.50em;
float:left;
background-color:#CCCCCC;
padding:1em;
}
#right {
width:35.50em;
float:left;
padding:1em;
}
#footer {
width: 48.00em;
height:18.75em;
background-color:#666666;
color:#FFFFFF;
padding:1em;
clear:both;
}
</style>
<body>
<div id="menu_fijo">
<p>menu fijo</p>
</div>
<div id="content">
<div id="header">
<p>contenido de la cabecera</p>
</div>
<div id="left">
<p>contenido de la columna izquierda</p>
<p>contenido de la columna izquierda</p>
<p>contenido de la columna izquierda</p>
<p>contenido de la columna izquierda</p>
<p>contenido de la columna izquierda</p>
</div>
<div id="right">
<p>contenido de la columna derecha</p>
<p>contenido de la columna derecha</p>
<p>contenido de la columna derecha</p>
<p>contenido de la columna derecha</p>
<p>contenido de la columna derecha</p>
<p>contenido de la columna derecha</p>
<p>contenido de la columna derecha</p>
<p>contenido de la columna derecha</p>
<p>contenido de la columna derecha</p>
<p>contenido de la columna derecha</p>
<p>contenido de la columna derecha</p>
<p>contenido de la columna derecha</p>
</div>
<div id="footer">
<p>contenido del footer</p>
</div>
</div>
Querría que el div #menu_fijo quedáse centrado.
