Problema al alinear div al centro, en IE7

[Jask]

Muy buenas, que tal :) ?

Bueno hice un diseño y lo pasé a Joomla, pero como siempre, todo iba bien hasta que apareció el maldito IE. Bueno estoy probando cosas en IE8 y le doy a vista de compatibilidad para ver como me quedaría, y me deforma casi toda la web, y no tengo manera de centrar el div :S ! A ver si alguien me puede ayudar porque llevo todo un día y no hay manera y pff.. es un caos ya..

Os dejo la web:

http://pruebas.areainnova.es/felipev/

Y aquí el código CSS:

Código CSS:

* {
    margin: 0;
    padding: 0;
    border: 0;
}
 
body, html{
    background-image: url(../images/bg.jpg);
    font-family: Verdana, Geneva, sans-serif;
    font-size: 14px;
    width:981px;
    margin:0 auto;
    /* Hack para IE * */
    *margin:0 auto 0 auto; 
    *text-align:left;
    height:100%;
}
 
.sombra_superior{
    display:block;
    height:23px;
    width:980px;
    background-image:url(../images/f5_sombra_superior.jpg);
}
 
.borde_izda{
    height:227px;
    width:56px;
    float:left;
    background-image:url(../images/f5_borde_izda.jpg);
    display:block;
}
 
.contenido{
    width:878px;
    float:left;
    display:block;
}
 
.borde_dcha{
    height:227px;
    width:46px;
    float:left;
    background-image:url(../images/f5_borde_dcha.jpg);
    display:block;
    position:relative;
    right:4px;
}
 
.logo{
    width:100%;
    float:left;
}
 
.only_float{
    float:left;
}
 
.menu_up{
    background-image:url(../images/f5_06.jpg); 
    width:611px; 
    height:62px;
}
 
.menu_down{
    background-image:url(../images/f5_09_2.jpg); 
    width:611px; 
    height:55px;
    text-align:center;
    color:#FFF;
}
 
.mainlevel{
    color:#FFF;
    font-size:12px;
    font-family:Verdana, Geneva, sans-serif;
    text-decoration:none;
    margin-left:17px;
    position:relative;
    top:19px;
}
 
/*.mainlevel a:link, .mainlevel a:visited{
    text-decoration:none;
}*/
 
a:link .mainlevel{
    background-color:red;
}
 
.contenido_izda{
    width:266px;
    float:left;
    height:100%;
}
 
.links{
    background-image:url(../images/f5_bg_bloqueizda.jpg);
    width:266px;
    height:287px;
    font-weight:bold; 
    font-size:12px;
}
 
.menu_principal{
    float:left; 
    width:266px;
}
 
.menu_titulo{
    color: #003b9d;
    padding-top: 20px;
    padding-left: 45px;
}
 
.menu_linea{
    background-image:url(../images/f5_linea_menu.jpg);
    height:2px;
    width:216px;
    position:relative;
    left:25px;
    top: 10px;
}
 
.menu_contenido{
    position: relative;
    bottom: -20px;
    list-style: none;
    padding-left:45px;
    *padding-left:5px;
}
 
.menu_contenido li{
    background-image:url(../images/f5_boton_li.jpg);
    background-repeat:no-repeat;
    padding-left: 30px;
    margin-bottom:5px;
    height:17px;
    *height:18px;
    padding-top: 1px;
    list-style: none;
}
 
li a:link, li a:visited{
    text-decoration:none;
    color: #002461;
}
 
li a:hover {
    color: #004fd5;
}
 
 
.hijo{
    float:left;
    min-height:100%;
    height:100%;
    width:100%;
}
 
.imagenes{
    float:left;
    width:265px;
    background-color:#a8c1e3;
    min-height:100%;
    height:100%;
}
 
.img_espaciada{
    padding-top: 10px;  
    background-color:#a8c1e3;
    height:100%;
}
 
.buscador{
    text-align:right;
    background-color: #335089;
    height: 44px;
    float:left;
    width:612px;
}
 
.buscador_pos{
    position: relative;
    top: 12px;
    left: 160px;
    width:400px;
}
 
.ir{
    font-weight:bold; 
    width:45px; 
    height:20px; 
    border:1px solid black;
}
 
 
.noticias{
    background-image:url(../images/f5_bg_noti.jpg);
}
 
 
 
/*.contentpaneopen .contentheading{
    margin-bottom:30px;
}*/
 
.contentheading{
    background-image:url(../images/f5_borde_noticia.jpg);
    background-position:bottom;
    background-repeat:repeat-x;
    *width:505px;
}
 
/*.contentpaneopen td{
    background-image:url(../images/f5_borde_noticia.jpg);
    background-position:top;
    background-repeat:repeat-x;
}
 
.buttonheading, .contentheading, .contentpaneopen tr{
    background:none !important;
}*/
 
.contentpaneopen .contentheading{
    margin-bottom:10px;
    display:block;
    width:505px;
}
 
.contenido_noticia{
    color:#013068;
    font-family:Verdana, Geneva, sans-serif;
    font-size:13px;
    width:100%;
    padding:38px 10px 10px 32px;
    width:90%;
}
 
.contenido_noticia a:link, .contenido_noticia a:visited{
    text-decoration:none;
    font-weight:bold;
    color:#00204E;
}
 
.contenido_noticia a:hover{
    color:#013068;
    text-decoration:overline;
}
 
.contentheading, .readon{
    color: #00204e;
    font-size:15px;
    font-weight:bold;
    padding-bottom:10px;
}
 
.ajksjkdfjaskf{
    margin:
 
.readon{
    font-size:13px !important;
    text-decoration:none;
    margin-bottom:40px;
}
 
.article_separator{
    display:block;
    background-color:#a0c1dc;
    width:100%;
    height:1px;
    margin:36px 0 45px 0;
}
 
.pie_noticia{
    width:100%;
    height:17px; 
    text-align:right; 
    position:relative; 
    left:45px;
}
 
.pie_noticia_redonda{
    float:right; 
    width:21px; 
    height:17px; 
    background-image:url(../images/f5_borde_noti.jpg);
}
 
/*********************************
    Formulario de Contacto
*********************************/
 
.contacto_ck input{
    border:1px solid black;
    background-color:#fff;
    width:170px;
}
 
.ck_formulario_left{
    float:left;
}
 
.ck_formulario{
    width:150px !important;
}
 
.ckCSSclear{
    width:500px;
    
}
 
.ckCSSlabel{
    text-align:right;
    padding-right:6px;
}
 
.ckCSSclear select{
    width:175px;
    border:1px solid black;
    background-color:#fff;
}
 
.ckBtnCon input{
    font-weight:bold;
    background-color:#f5f5f5;
    border:1px solid #cecece;
    position:relative;
    bottom:270px;
    right:48px;
    width:60px !important;
}
 

Saludos y gracias :)

[juanito1712]

Tal vez mi respuesta no te sirva de much ayuda pero aveces es mas facil rehacer la web preocupandonos desde un principio que no se destroce, que una vez terminada ver que se destroza y tratar de arreglarlo, al final terminaras con "grapas" por todos los lados para que case y cuando vaya en uno no ira en otro y así hasta el infinito y ademas el dia de mañana cuando quieras modificar cualquier cosita te enfrentaras al mismo problema.

Planteate cuantas horas llevas arregalndo la web y el caos en el que te ves inmerso ahora mismo y cuantas horas te costaria volverlo a hacer, las segundas veces se hacen mucho mas rapido, te lo puedo asegurar.

Y es muy triste pero... cuando estamos manos a la obra, por mucho que nos guste el fierfox o el chrome, toca utiliza el explorer 6 desde el principio para no llevarnos sustos de ultima hora.

[Jask]

Soy partidario de volver a hacer las cosas cuando algo sale mal pero esto tiene su trabajo y no puedo empezar de 0 ya que primero tendría que maquetarlo, luego tendría que implementarlo en el joomla, y así un largo etc y no es algo en lo que pueda perder más tiempo a si que a ver si alguien tiene idea de que puede estar pasando.

Un saludo y gracias :) !!

[carscx]

Puedes crear otro CSS sólo para IE7, la plantilla beez de Joomla, los tiene, y muchas otras. Por lo que he visto (en IE7) , la web se te mueve entera a la izquierda en lugar de estar centrada y el cuadro buscar se desplaza a la derecha. Es cuestión de margenes y rellenos.

Si tienes Firefox, instala la extension Firebug, te será de muchisima a la hora de maquetar con CSS. Puedes seleccionar el elemento que quieras y cambiarle el estilo online. Asi puedes comprobar como va quedando.

La herramienta de IE8 para debuguear CSS tambien te puede ayudar pero menos, no deja de ser un "Ver código fuente".

Un saludo,