[SOLUCIONADO] Problema -muy- molesto con IE

[lauchalp95]

Bueno, como todos sabemos, el IE muchas veces nos causa muchos dolores de cabeza..
En Chrome y FF, mi sitio se ve correctamente, pero en IE, ¡las barras laterales se ven por debajo del contenido!
Codigo HTML:

Código HTML:

<div align="center" id="global"> <div id="banner"><img src="/img/banner/simula2slogan.png" width="500" height="100" /></div>  
  <div id="control"> 
     
      <? if(isset($_COOKIE['MM_Username'])) { require("./modulos/control.php");} else { require("./modulos/controln.php"); }; ?>
</div>
  <div id="cuerpo">  
  <p><br />
    <br />
  </p>
  <p>&nbsp;</p>
  <p>&nbsp;</p><br /><br />
<div id="menu">      <? require("./modulos/menu.php");
 
 ?></div>
 <div class="curved" id="izquierda">    <? if(isset($_COOKIE['MM_Username'])) { require("./modulos/izquierda.php");} else { require("./modulos/izquierdan.php"); }; ?>
   
 </div>
 <div class="curved"id="derecha"> <? if(isset($_COOKIE['MM_Username'])) { require("./modulos/derecha.php");} else { require("./modulos/derechan.php"); }; ?>   
 
 </div>
 <div id="contenido"><!-- TemplateBeginEditable name="contenido" -->
   <p style="text-align: left">&nbsp;</p>
 <!-- TemplateEndEditable --></div>
 
  </div>
  <div class="curved" id="copy">      <? require("./modulos/copy.php"); ?></div>
</div>
 

Código CSS:

Código CSS:

<style type="text/css">
body,td,th {
    font-family: Verdana, Geneva, sans-serif;
    font-size: 12px;
    color: #FFF;
}
body {
    background-color: #333 !important;
 
}
a:link {
    color: #F00;
    font-weight: bold;
    text-decoration: underline;
}
a:visited {
    text-decoration: underline;
}
a:hover {
    text-decoration: none;
}
a:active {
    text-decoration: underline;
}
#global {
    width:1024px;
    margin:auto;
    background-color: #333;
    
}
#banner {
    float: left;
    width: 500px;
    height:110px;
}
#control {
    float:right;
    width:500px;
    height:110px;
    border: 1px dashed #F00;
 
}
#cuerpo {
    width: 1024px;
    margin:auto;
        
}
#contenido {
    width: 660px;
    margin-right: 150px;
    margin-left: 192px;
        
}
#copy {
    height: 20px;
    width: 1024px;
    background:#000;
}
#menu {
    height: 26px;
    width: 768px;
    border: 2px dotted #999;
    margin:auto;
}
#izquierda {
    float: left;
    width: 170px;
    background-color: #666;
    border: 1px solid #666;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    padding: 10px;
    height: 1000px;
    margin-top: 5px;
}
#derecha {
    float: right;
    width: 150px;
    background-color:#666;
    border: 1px solid #666;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    padding: 10px;
    height: 1000px;
    margin-top: 5px;
}
.curved {
-moz-border-radius: 15px; /* Firefox */
-webkit-border-radius: 15px; /* Safari and Chrome */
border-radius: 15px; /* Opera 10.5+, future browsers, and now also Internet Explorer 6+ using IE-CSS3 */
 
behavior: url(border-radius.htc); /* This lets IE know to call the script on all elements which get the 'box' class */
}
.titulo {
    text-align: left;
}
.contenido {
}
</style>
 

Solucioné el problema modificando los anchos, se ve que IE los interpreta un poco mal las posiciones..

[sanxuan]

La mayor parte de las diferencias que se aprecian entre IE y otros exploradores suelen venir de no utilizar la etiqueta <!DOCTYPE> para definir el tipo de documento HTML.
Otra medida muy saludable es validar el código HTML y CSS en http://validator.w3.org/unicorn
Cuando aparecen errores, cada navegador los interpreta a su manera, pudiendo ofrecer resultados distintos. Seguir los estándares del w3c es la mejor garantía de éxito.
Otras diferencias aparecen por permitir que sea el navegador quien decida algunas propiedades por defecto. Si damos valores a esas propiedades en nuestro CSS, las diferencias desaparecen.
Tan solo hay algunas pocas diferencias entre navegadores que no se correspondan con ninguno de los problemas anteriores.

[kseso?]

A mayores:
Publique el html generado, no el programado.
Identifique los div´s por su nombre de clase o id que les haya dado.
Y si tiene la página en línea, un enlace a la misma nunca está de más para reproducir el problema. Que hay veces que los estilos heredados también influyen.

P.D.: debería evitar el "align center", "p" vacíos y "br"´s para lograr las separaciones. Use márgenes, padding´s y demás propiedades.

[lauchalp95]

Gracias a los dos, tomaré sus sugerencias!