Hola estoy empezando con CSS y estoy practicando con la propiedad width de CSS y en el IE y el Iceweasel me aparece diferente que en opera y firefox.
Aqui les dejo el código
HTML: Código PHP:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<link rel="stylesheet" type="text/css" href="Margenes.css">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Márgenes</title>
</head>
<body>
<div id="contenido">
<p style="border: none;">Hola</p>
<p class="p1">Párrafo con margen = margin-left: 1em;</p>
<p class="p2">Párrafo con margen = margin: 2em;</p>
</div>
</body>
</html>
CSS: Código PHP:
* {
margin: 0;
padding: 0;
}
body {
background-color: #a9f3c8;
font: 1em sans-serif;
}
p {
font-size: .9em;
border: 1px solid black;
margin-bottom: .5em;
}
div {
margin-left: .5em
margin-top: .5em;
margin-bottom: .5em;
}
div#contenido {
width: 800px;
border: 1px solid blue;
background-color: #bdabab;
}
.p1 {
width: 35%;
margin-left: .9em;
}
.p2 {
width: 28%;
margin-left: 2em;
}
y aqui les dejo las capturas de pantalla:
firefox (windows xp):
http://img2.imageshack.us/my.php?ima...oxwindowst.png
opera (windows xp):
http://img509.imageshack.us/my.php?i...erawindows.png
IE 6 (windows xp):
http://img2.imageshack.us/my.php?image=98729669.png
opera (debian gnu/linux):
http://img509.imageshack.us/my.php?i...peradebian.png
iceweasel (debian gnu/linux):
http://img509.imageshack.us/my.php?image=iceweasel.png
Con la unidad "em" en el ejemplo esta 1em que es igual a 16 (medida por default en mis navegadores) entonces ¿todas las unidades em que establezca en adelante va a tomar ese valor (1em = 16)? por ejempo
body {
font: 1em sans-serif;
}
p {
font-size: .9em; es igual a 0.9 x 1em(16px) = 14.4px
margin-bottom: .5em; es igual a 14.4 x .5 = 7.2px
width: 20em; es igual a 14.4 x 20 = 288px
}
Gracias.