Foros del Web - Ver Mensaje Individual

sanxuan · #4 (**permalink**) 27/02/2011, 17:00

Prueba esta cabecera: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
Debería ser suficiente para que IE mostrase bien el código. Hay pocos cambios con respecto a tu código original, incluir todos los elementos de <ul> dentro de una etiqueta <li> y algunos cambios en las etiquetas <img> y <hr>. El problema de los colores es muy simple. Hay bastantes propiedades donde usas la codificación decimal pero olvidas la almohadilla (#) delante a la hora de definir el color. Quedaría de la siguiente forma:

Código HTML:

Ver original<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
            "http://www.w3.org/TR/html4/loose.dtd">
<head>
<title>titulo</title> 
<style type="text/css">
body {
padding-left: 11em;
background-color: #708090; }
ul.navbar static-id {
position: fixed;
}
ul.navbar {
list-style-type: none;
padding: 0;
margin: 0;
background: #f4a460;
position: absolute;
top: 12em;
left: 1em;
width: 9em }
h1 {
font-family: Helvetica, Geneva, Arial,
SunSans-Regular, sans-serif }
ul.navbar li {
margin: 0.5em 0;
padding: 0.3em;
}
ul.navbar a {
text-decoration: none }
a:link {
color: #ffff00 }
a:visited {
color: #ffffff }
address {
margin-top: 1em;
padding-top: 1em;
border-top: thin dotted }
 
ul.navbar2 static-id {
position: fixed;
}
ul.navbar2 {
list-style-type: none;
padding: 0;
margin: 0;
background: #f4a460;
position: absolute;
top: 12em;
right: 1em;
width: 9em }
h1 {
font-family: Helvetica, Geneva, Arial,
SunSans-Regular, sans-serif }
ul.navbar2 li {
 
margin: 0.5em 0;
padding: 0.3em;
}
ul.navbar2 a {
text-decoration: none }
a:link {
color: #ffff00 }
a:visited {
color: #ffffff }
address {
margin-top: 1em;
padding-top: 1em;
border-top: thin dotted }
#cabecera{
z-index:1;
margin-top:1px;
margin-left:25px;
position: absolute;
}
#contenido {
z-index:2;
font-family: Georgia, "Times New Roman",Times, serif;
color:#FDF5F5;
margin-left:200px;
margin-top:195px;
position: absolute;
}
</style>
</head>
<body>
<ul class="navbar" style="position: fixed;">
<li><b><u> Ediciones Anteriores</u></b>
<li><a href="edI.html">I Edición</a>
<li><a href="edII.html">II Edición</a>
<li><a href="edIII.html">III Edición</a>
<li><a href="edIV.html">IV Edición</a>
<li><a href="index.html">V Edición</a>
</ul>
<ul class="navbar2" style="position: fixed;"> 
<li><a href="programav.html">Programa</a>
<li><a href="invitadosv.html">Invitados</a>
<li><a href="exposicionesv.html">Exposiciones</a>
<li><a href="fotosv.html">Fotos</a>
<li><a href="patrocinadoresv.html">Patrocinadores</a>
<li><a href="cartelv.html">Cartel</a>
<li><a href="notoiasv">Noticias</a>
<li><a href="mapacasacolon.html">Mapa Casa Colón</a>
</ul>
<div id="cabecera"><img src="cabecera.jpg" width="250" height="75" alt=""/></div>
<div id="contenido">
<h1>Programaci&oacute;n:</h1>
<hr/>
</div>
</body>
</html>

Otra posibilidad es usar XHTML. Obliga a cerrar las etiquetas <li> y poca cosa más.

Código HTML:

Ver original<!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" xml:lang="en-US" lang="en-US" dir="ltr" >
<head>
<title>Sozo wordpress 3</title> 
<style type="text/css">
body {
padding-left: 11em;
background-color: #708090; }
ul.navbar static-id {
position: fixed;
}
ul.navbar {
list-style-type: none;
padding: 0;
margin: 0;
background: #f4a460;
position: absolute;
top: 12em;
left: 1em;
width: 9em }
h1 {
font-family: Helvetica, Geneva, Arial,
SunSans-Regular, sans-serif }
ul.navbar li {
margin: 0.5em 0;
padding: 0.3em;
}
ul.navbar a {
text-decoration: none }
a:link {
color: #ffff00 }
a:visited {
color: #ffffff }
address {
margin-top: 1em;
padding-top: 1em;
border-top: thin dotted 
}
ul.navbar2 static-id {
position: fixed;
}
ul.navbar2 {
list-style-type: none;
padding: 0;
margin: 0;
background: #f4a460;
position: absolute;
top: 12em;
right: 1em;
width: 9em 
}
h1 {
font-family: Helvetica, Geneva, Arial,
SunSans-Regular, sans-serif 
}
ul.navbar2 li {
margin: 0.5em 0;
padding: 0.3em;
}
ul.navbar2 a {
text-decoration: none 
}
a:link {
color: #ffff00 
}
a:visited {
color: #ffffff }
address {
margin-top: 1em;
padding-top: 1em;
border-top: thin dotted 
}
#cabecera{
z-index:1;
margin-top:1px;
margin-left:25px;
position: absolute;
}
#contenido {
z-index:2;
font-family: Georgia, "Times New Roman",Times, serif;
color:#FDF5F5;
margin-left:200px;
margin-top:195px;
position: absolute;
}
</style>
</head>
<body>
<ul class="navbar">
<li style="text-decoration:underline; font-weight:bold;"> Ediciones Anteriores</li>
<li><a href="edI.html">I Edición</a></li>
<li><a href="edII.html">II Edición</a></li>
<li><a href="edIII.html">III Edición</a></li>
<li><a href="edIV.html">IV Edición</a></li>
<li><a href="index.html">V Edición</a></li>
</ul>
<ul class="navbar2"> 
<li><a href="programav.html">Programa</a></li>
<li><a href="invitadosv.html">Invitados</a></li>
<li><a href="exposicionesv.html">Exposiciones</a></li>
<li><a href="fotosv.html">Fotos</a></li>
<li><a href="patrocinadoresv.html">Patrocinadores</a></li>
<li><a href="cartelv.html">Cartel</a></li>
<li><a href="notoiasv">Noticias</a></li>
<li><a href="mapacasacolon.html">Mapa Casa Colón</a></li>
</ul>
<div id="cabecera"><img src="cabecera.jpg" width="250" height="75" alt="" /></div>
<div id="contenido">
<h1>Programaci&oacute;n:</h1>
<hr/>
</div>
</body>
</html>