« anterior próximo »
Páginas: [1] 2 3   Ir Abajo

Autor Tema: Centrar elementos en IE (SOLUCIONADO)  (Leído 8717 veces)

Desconectado Rododendro

  • Junior Member
  • **
  • Mensajes: 95
Centrar elementos en IE (SOLUCIONADO)
« en: 07 de Enero de 2008, 06:33:23 pm »
Hola, necesito saber si existe algún codigo o script específico que permita centrar en Internet Explorer los elementos que Firefox muestra sin problema correctamente centrados -me refiero sobre todo a menús horizontales elaborados con CSS-.

  Un saludo y feliz año a todos.
En línea

Desconectado WillyN

  • Member
  • ***
  • Mensajes: 234
    • Escuela Canina Maya
Re: Centrar elementos en IE
« Respuesta #1 en: 08 de Enero de 2008, 10:49:01 pm »
margin: 0 auto;

Pero me temo que necesitas algo más complicado porque estás hablando de un menú.

¿Qué código estás usando?
En línea
Si te interesa el comportamiento de los perros, visíta Escuela Canina Maya

Desconectado Rododendro

  • Junior Member
  • **
  • Mensajes: 95
Re: Centrar elementos en IE
« Respuesta #2 en: 09 de Enero de 2008, 07:36:34 pm »
El código general lo he ido variando con varias alternativas, pero como el problema persiste supongo que la pega estará en el menú propiamente dicho. Es el descrito en http://css.maxdesgin.com.au/listamatic/horizontal04.htm. Curiosamente, luego he visto que otro usuario tenía dificultades con ese código, en el sentido de ver los diferentes enlaces desordenados o algo así. Yo lo veo perfectamente, sólo que en IE aparece desplazado a la izquierda, y como digo, por más que cambio el diseño general de la página no hay forma de centrarlo en ese navegador.

  Un saludo y gracias por contestar.
En línea

Desconectado WillyN

  • Member
  • ***
  • Mensajes: 234
    • Escuela Canina Maya
Re: Centrar elementos en IE
« Respuesta #3 en: 09 de Enero de 2008, 10:21:50 pm »
¿Estas usando exactamente el mismo código, éste?
Código: [Seleccionar]
HTML
<div id="navcontainer">
<ul id="navlist">
<li id="active"><a href="#" id="current">Item one</a></li>
<li><a href="#">Item two</a></li>
<li><a href="#">Item three</a></li>
<li><a href="#">Item four</a></li>
<li><a href="#">Item five</a></li>
</ul>
</div>

CSS
#navlist
{
padding: 0 1px 1px;
margin-left: 0;
font: bold 12px Verdana, sans-serif;
}

#navlist li
{
list-style: none;
margin: 0;
border-top: 1px solid gray;
display: inline;
}

#navlist li a
{
padding: 0.25em 0.5em 0.25em 0.75em;
border-left: 1em solid #AAB;
background: #CCD;
text-decoration: none;
}

#navlist li a:link { color: #448; }
#navlist li a:visited { color: #667; }

#navlist li a:hover
{
border-color: #FE3;
color: #FFF;
background: #332;
}
Tal como está ese menu en la página http://css.maxdesign.com.au/listamatic/horizontal04.htm lo veo igualitoigualito tanto en IE7 como en FF.
En línea
Si te interesa el comportamiento de los perros, visíta Escuela Canina Maya

Desconectado Rododendro

  • Junior Member
  • **
  • Mensajes: 95
Re: Centrar elementos en IE
« Respuesta #4 en: 10 de Enero de 2008, 12:25:55 pm »
Pues en IE6 no parece haber manera de corregir su desplazamiento a la izquierda, al menos yo no lo consigo. La versión 7 subsana algunos problemas de las anteriores -como la visualización correcta de las imágenes PNG, por ejemplo-, así que posiblemente sea más respetuosa con algunos estándares que sus predecesoras; aunque esto, obviamente, no exime de buscar un remedio (no todo el mundo usa la versión más actual de su navegador...).

         Saludos.

   
En línea

Desconectado WillyN

  • Member
  • ***
  • Mensajes: 234
    • Escuela Canina Maya
Re: Centrar elementos en IE
« Respuesta #5 en: 10 de Enero de 2008, 12:58:05 pm »
En IE6 también lo veo igualito.

Sospecho que el problema tiene que ver con el resto del código que estás usando.

Si pones un enlace a una página donde tienes incorporado el menú se puede mirar más a fondo el asunto.
En línea
Si te interesa el comportamiento de los perros, visíta Escuela Canina Maya

Desconectado Rododendro

  • Junior Member
  • **
  • Mensajes: 95
Re: Centrar elementos en IE
« Respuesta #6 en: 10 de Enero de 2008, 07:17:47 pm »
Si cuando dices que lo ves igualito en IE6 te refieres a verlo tal y como aparece en la página del ejemplo, pues la verdad es que yo también lo veo tal cual. Lo que pasa es que en las pruebas que estoy haciendo en local se ve de esa misma forma, lo que significa entre otras cosas... a la izquierda. He usado Google para buscar información; y en varias páginas y blogs donde se explica cómo crear un menú con CSS, entre los comentarios añadidos por los visitantes casi siempre hay alguno con la misma duda que yo: "sí, me funciona bien, pero ¿cómo puedo centrarlo?" 

 
En línea

Desconectado WillyN

  • Member
  • ***
  • Mensajes: 234
    • Escuela Canina Maya
Re: Centrar elementos en IE
« Respuesta #7 en: 10 de Enero de 2008, 09:05:55 pm »
Lo puedes centrar colocándolo en un div al cual pones en el css la siguiente propiedad:
Código: [Seleccionar]
margin: 0 auto;
En línea
Si te interesa el comportamiento de los perros, visíta Escuela Canina Maya

Desconectado Rododendro

  • Junior Member
  • **
  • Mensajes: 95
Re: Centrar elementos en IE
« Respuesta #8 en: 11 de Enero de 2008, 12:46:42 pm »
Y tomando como referencia el código del menú, ¿dónde iría ese añadido? ¿Te refieres simplemente a dejar el código igual, pero "encerrándolo" en un div horizontal, transparente, algo mayor que el menú y dándole ese "margin: 0 auto;" que mencionas?
En línea

Desconectado WillyN

  • Member
  • ***
  • Mensajes: 234
    • Escuela Canina Maya
Re: Centrar elementos en IE
« Respuesta #9 en: 11 de Enero de 2008, 06:35:47 pm »
Así queda centrado:
Código: [Seleccionar]
<html>
<head>
<style type="text/css">
body {
text-align:center; /* center #navcontainer in IE5 */
}
#navcontainer {
margin: 0 auto;
}

#navlist {
width: 100%;
padding: 0 1px 1px;
font: bold 12px Verdana, sans-serif;
}

#navlist li {
list-style: none;
margin: 0;
border-top: 1px solid gray;
display: inline;
}

#navlist li a {
padding: 0.25em 0.5em 0.25em 0.75em;
border-left: 1em solid #AAB;
background: #CCD;
text-decoration: none;
}

#navlist li a:link {
color: #448;
}
#navlist li a:visited {
color: #667;
}

#navlist li a:hover {
border-color: #FE3;
color: #FFF;
background: #332;
}
</style>
</head>
<body>
<div>
<div id="navcontainer">
<ul id="navlist">
<li id="active"><a href="#" id="current">Item one</a></li>
<li><a href="#">Item two</a></li>
<li><a href="#">Item three</a></li>
<li><a href="#">Item four</a></li>
<li><a href="#">Item five</a></li>
</ul>
</div>
</div>
</body>
</html>Para verlo tal cual copias este código, lo pegas en un documento, lo guardas como p.ej. menu.html y lo abres en tu navegador.
En línea
Si te interesa el comportamiento de los perros, visíta Escuela Canina Maya
Páginas: [1] 2 3   Ir Arriba
« anterior próximo »
 

Aviso Legal | Política de Privacidad | Política de Cookies

el contenido de la web se rige bajo licencia
Creative Commons License
creative commons.