MULTIMEDIA, Video digital, Grabación, Diseño gráfico, Diseño web, Programación > Webmasters - Diseño Web - Programación - Diseño gráfico
Centrar elementos en IE (SOLUCIONADO)
Rododendro:
Muchas gracias, WillyN, probaré ese código lo antes posible. No obstante, necesito saber un detalle antes de cualquier ensayo: la parte del código -comentario creo que se llama- donde se lee "/*center #navcontainer in IE5 */", ¿basta para que el menú quede centrado en todas las versiones de IE anteriores a la más moderna? Pregunto esto porque yo en IE6 lo veo desplazado a la izquierda...
WillyN:
Pués yo en IE6 lo veo centrado,
Mira lo que has hecho, y claro, si tienes más código en la página de prueba, éste influirá.
Rododendro:
Pues ahí va el último de los varios códigos que he ido probando. Con el tuyo sí veo el menú centrado, pero había una pequeña separación entre cada enlace, y además el cambio de color no me funcionaba.
Bien, primero el CSS:
<style type="text/css">
#pagina {
text-align: center;
width: 740px;
margin: auto;
}
#contenido {
width: 720px;
position: relative;
top: 50px;
left: 270px;
margin-top: 35px;
}
H1 {
text-align: center;
}
H2 {
text-align: justify;
}
H3 {
text-align: justify;
}
table {
width: 80%;
text-align: center;
margin-left: auto;
margin-right: auto;
}
#navcontainer {
margin: 0 auto;
}
#navlist {
padding: 0 1px 1px;
margin-left: 0;
font: bold 12px Verdans, sans-serif;
text-align: center;
position: relative;
top: 25px;
left: 210px;
}
#navlist li {
list-style: none;
margin: 0;
border-top: 1px solid gray:
display: inline;
}
#navlist li a {
padding: 0.25em 0.5 em 0.25em 0.75em;
border-left: 1em solid #AAB;
text-decoration: none;
width: 160px;
display: block;
float: left;
}
#navlist li a: link {color: #448;}
#navlist li a: visited {color: #667;}
#navlist li a: hover {
border-color: #FE3;
color: #FFF;
background: #332;
}
</style>
Y ahora, el documento html propiamente dicho:
<!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head>
<title>Ejercicio</title>
<link href="..//carpetauno/estilo.css" rel="stylesheet" type="text/css" />
<style>
.floatright {
float: right;
margin: 2px 2px 12px 12px;
}
.floatleft {
float: left;
margin: 2px 12px 12px;
}
</style>
</head>
<body style=background: #00FF00;>
<div id="pagina">
<div id="contenido">
<p><H1>Título del ejercicio</H1></p>
<p><H2>
<img class="floatright" src="../imagenes/playa.jpg" alt="arenal" />Aquí ponemos un rollete de varías líneas...</H2></p>
<br><br>
<center>
<table>
<tbody>
<tr>
<td>
<p><H3>Blablablá...</H3></p>
</td>
</tr>
</tbody>
</table>
</center>
<br><br>
<p><H2>Blablablá...</H2></p>
<br><br>
<div id="navcontainer">
<ul id="navlist">
<li id="active">
<li><a href="#">Enlace uno</a></li>
<li><a href="#">Enlace dos</a></li>
<li><a href="#">Enlace tres</a></li>
<li><a href="#">Enlace cuatro</a></li>
<li><a href="#">Enlace cinco</a></li>
</ul>
</div>
</div>
</body>
</html>
Bueno, pues salvo error de transcripción ése es el último código en el que fracasa el centrado del menú. He obviado algunos datos irrelevantes, como el color de fondo, el tipo de fuente, etc .(Otro detalle: si especifico unl color distinto para "pagina" y "contenido", ¿cómo se hace para que el color del body esté indicado ya en el archivo CSS sin tener que especificarlo en la propia página? ¿"Body" y "página son lo mismo a efectos de código?)
Un saludo y gracias por la ayuda que me estás brindando, WillyN ;-)
WillyN:
Estás liando mucho más de la cuenta las cosas, tanto que me mareo pensando en cómo explicarte como deberías hacerlo.
Te vendría bién un cursillo de html y de css.
Me gustaría poder darte ese cursillo yo aquí pero tampoco soy un enterado del tema, lo siento.
Rododendro:
--- Cita de: WillyN en 13 de Enero de 2008, 06:10:25 pm ---Estás liando mucho más de la cuenta las cosas, tanto que me mareo pensando en cómo explicarte como deberías hacerlo.
--- Fin de la cita ---
Pues, la verdad, pienso que el diseño mencionado es de lo más simple que pueda haber, no incorpora efectos de ninguna clase, sólo es una mera presentación de texto con alguna imagen y un menú horizontal, por eso me extraña la dificultad de centrar ese menú, que es lo çunico que no acabo de lograr.
--- Citar ---Te vendría bién un cursillo de html y de css.
--- Fin de la cita ---
He mirado ya unos cuantos, y todos dicen que poniendo tal código se consigue tal efecto. Yo me he fiado de ellos, y resulta que cuando eso no ocurre, ni el cursillo ni nadie es capaz de hacerte salir del atolladero. Se supone que es preferible maquetar con divs, pero si uno se topa con un problema tan elemental como irresoluble (centrar el menú en el navegador más utilizado- ¿no será mejor tirar de tablas y menú con Javascript?
Me gustaría poder darte ese cursillo yo aquí pero tampoco soy un enterado del tema, lo siento.
[/quote]
Navegación
[#] Página Siguiente
[*] Página Anterior
Ir a la versión completa