Problema para centrar div en IE8

[bengiss]

Hola a todos,

Tengo un problema centrando un div en IE8, aqui esta la pagina para que puedan ver a que me refiero:
http://jumpstartseo.jvsoftware.com/

Basicamente tengo 3 div principales el header, container y footer, con un ancho de 100% para que el fondo abarque todo el ancho, y dentro centré un div de 966px para el resto del contenido.

En FF, Safari y Chrome se ve el efecto que quiero pero no se porque en IE8 el div central no se centra sino que se coloca hacia la izquierda.

Alguien sabe cual es el problema?

Saludos.

[Milen]

Pues si no mencionas cómo lo estas intentando centrar.. no sé, podrían ser muchas cosas.

[bengiss]

Basicamente el codigo es algo asi:

Código HTML:

<div id="contenedor">
    <div id="area-principal">
        <h1>Prueba!</h1>
    </div>
</div>
 

Y el CSS:

Código CSS:

#contenedor{
    width: 100%;
}
#area-principal{
    margin-right: auto;
    margin-left: auto;
    width: 900px;
}
 

El "contenedor" tiene un ancho de 100% (en el codigo se ve el caracter en html pero es %) para que ocupe el ancho del navegador sin importar la resolucion, asi puedo repetir un fondo degradado a lo largo de la pantalla, el "area-principal" es el area donde va el contenido de la pagina y tiene un ancho fijo de 900px y con los margenes "right" y "left" lo centro dentro del contenedor.

Como mencione funciona en FF, safari, chrome y opera pero en IE el "area-principal" no se centra sino que se muestra a la izquierda.

Espero no sea muy confuso.

Saludos

[pitufoweb]

Al body ponle text-align:center y en el #area-principal lo pones otra ves a la izquierda.


Ejemplo:

body { text-align: center; }


#area-principal {text-align: left; }





Saludos

[bengiss]

Muchas gracias, esto soluciono el problema!

[alexk]

Iniciado por pitufoweb

Al body ponle text-align:center y en el #area-principal lo pones otra ves a la izquierda.
Ejemplo:
body { text-align: center; }

#area-principal {text-align: left; }

Saludos

" text-align" es para alinear texto como la propiedad indica... lo correcto es "margin:0 auto;"
bengiss si no te funciona dicha propiedad verifica si esta correcto tu <!doctype>

[asm_mripZ]

Hola que tal !!, tengo el mismo problema tengo todo alineado y nada que logro arreglarlo, tengo solo como 1 px movido el header a la izquierda respecto al body (div#container).
Igual funciona bien en firefox, ie9, ie7, ie6, safari, chrome. pero no en el ie8 .

Código CSS:

div#header {
background-image:url(images/header/header-bckgr_05.png);
background-position:bottom;
background-repeat:no-repeat;
height:108px;
margin:0 auto;
width:61.625em; /*986px*/
}
 
div#wrapper{
width:100%;
height:100%;
}
 
div#container {     
background-image:url('../images/main-bckgr.png');
background-repeat:repeat-y;
height:100%;
margin:0 auto;
width:61.625em; /*986px*/
}
 
div#contentbox {
margin:0 auto;
width:54.063em; /*865px*/
height:100%;
}
 
div#content {
float:left;
width:34.063em; /*545px*/
 
}
 
div.sidebar {
float:right;
width:20em; /*320px*/
}
 

Mi estructura:

Código HTML:

<div id="wrapper">
      <div id="header">Logo ---- [Menu]</div>
      <div id="container">
            <div id="contentbox">
                  <div id="content">Content Column</div>
                   <div id="sidebar">Right Menu</div>
            </div><!--#contentbox-->
      </div><!--#container-->
     <div id="footer">footer here!</div>
</div><!--#wrapper-->
 

Gracias de antemano, saludos!!!

[jomaruro]

Hola:

Iniciado por Milen

Pues si no mencionas cómo lo estas intentando centrar.. no sé, podrían ser muchas cosas.

¿Como quieres que te lo mencione? ¿No te basta que haya puesto la URL?

Iniciado por bengiss

Tengo un problema centrando un div en IE8, aqui esta la pagina para que puedan ver a que me refiero: http://jumpstartseo.jvsoftware.com/

Saludos.