IE hace lo que quiere

ChikiChiki · #1 (**permalink**) 13/09/2005, 14:10

Hola a todos:

Ya no puedo más, FireFox muestra el contenido como yo quiero, pero con IE no lo logro. El box del medio, en IE, unas veces no aparece y otras aparece más bajo de lo que quiero. Quiero que esté encuadrado en el centro. Podeis ver lo que me gustaría tener en FF. ¿Sabeis que puede estar ocurriendo?

Os dejo el código y el link.
Gracias, un saludo, ChikiChiki.

Código HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<style>
  body {
    margin:9px 9px 9px 9px;
    padding:0;
    background:#333300;}
  #level0 {
    padding-bottom: 9px;
    background: #333300;}
  #cabecera {
    top: 9px;
    left: 9px;
    height: 90px;
    background: #FFCC66;}
  #level1 {
    background: #FFCC00;
    position: relative;
    width:100%;}
  #level2 {
    margin-left: 143px;
    padding-left: 9px;
    background: #333300;}
  #level3{
    background: #FFFF66;}
  #level4 {
    margin-right: 143px;
    padding-right: 9px;
    background:#333300;}
  #main {
    background:#CCCC66;}    
  #level5 {
    padding-top:9px;
    background:#333300;}
  #footer {
    background:#FFCC66;}
  #lftBar {
    position: absolute;
    width: 143px;
    top: 0px;
    left: 0px;}
  #rgtBar {
    position: absolute;
    width: 143px;
    top: 0;
    right: 0;}
</style>
</head>

<body>
  <div id="level0">
    <div id="cabecera">
      Aquí va la cabecera
    </div>
  </div>

  <div id="level1">
    <div id="lftBar">
      Estamos en el lado Izquierdo.
    </div>
    <div id="level2">
      <div id="level3">
        <div id="rgtBar">
          Estamos en la zona derecha.
        </div>
        <div id="level4">
          <div id="main">
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          </div>
        </div>
      </div>
    </div>
  </div>    

  <div id="level5">
    <div id="footer">
      Aquí va el pie.
    </div>
  </div>
   
</body>
</html>

ChikiChiki · #2 (**permalink**) 13/09/2005, 14:14

oops!!!.... Olvidé poner el link: http://es.geocities.com/art_triton/

Hildergarn · #3 (**permalink**) 14/09/2005, 12:15

De repente, digo según mi opinion, que el código que tira Geocities con los banner esté interfiriendo. Digo eso porque una vez tuve algo similar y todo fue por esos molestos banners. Trata de probar en otro sitio libre de publicidad y nos avisas.

saludos

pellagofio · #4 (**permalink**) 14/09/2005, 14:09

Me he tomado la libertad de modificar tu código.
Como puedes ver lo he reducido y estructurado de otra forma.
La presentación en IE se ajusta a lo que tú quieres. No lo he probado en otros navegadores.

Espero que te ayude.

Código HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<style>

body { background-color:#333300;}

#cabecera { background:#FFCC66; 
                 width: 100%; 
                 height: 90px;}
 
#lftBar   { background:#FFCC66; 
               float: left; 
               width: 143px; 
               margin-top:10px;}
   
#rgtBar   { background:#FFCC66; 
               float: 
               left;width: 143px; 
               margin-top:10px;}

#main     { background:#CCCC66; 
               float: left;
               width: 450px; 
               margin-bottom:10px; 
               margin-top:10px; 
               margin-left:10px; 
               margin-right:10px;}

#footer   { background:#FFCC66; 
               width: 100%;}

	

</style>
</head>

<body>
<!-- following code added by server. PLEASE REMOVE -->
<script language="JavaScript" src="http://es.geocities.com/js_source/ygIELib9.js?v3"></script><script language="JavaScript">var yviContents='http://themis.geocities.yahoo.com/themis/as.php?cc=es&s=382026078&l=NE&b=1&t=1126727500';yviR='es';yfiEA(0);</script>
<!-- preceding code added by server. PLEASE REMOVE -->
    <div id="cabecera">
      Aquí va la cabecera
    </div>

  <div id="pagina">
    <div id="lftBar">
      Estamos en el lado Izquierdo.
    </div>

    <div id="main">
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
          Estamos en Main <br />
    </div>

    <div id="rgtBar">
       Estamos en la zona derecha.
    </div>


  </div>    

    <div id="footer">
      Aquí va el pie.
    </div>
   
</body>
</html><!-- text below generated by server. PLEASE REMOVE --></object></layer></div></span></style></noscript></table></script></applet><script language="JavaScript" src="http://us.i1.yimg.com/us.yimg.com/i/mc/mc.js"></script><script language="JavaScript" src="http://geocities.com/js_source/geov2.js"></script><script language="javascript">geovisit();</script><noscript><img src="http://visit.webhosting.yahoo.com/visit.gif?es1126727179" alt="setstats" border="0" width="1" height="1"></noscript>
<IMG SRC="http://geo.yahoo.com/serv?s=382026078&t=1126727179&f=es-w70" ALT=1 WIDTH=1 HEIGHT=1>

CORE · #5 (**permalink**) 14/09/2005, 20:39

no solo IE tambien
WMP
MSN
Office
tambien Gates

ChikiChiki · #6 (**permalink**) 15/09/2005, 05:34

Gracias por preocuparos... pero < odio los peros :) >
No hace exactamente lo que quiero. Busco que los menus laterales se peguen a los laterales de la pantalla y el "main" ocupe el resto del espacio. De forma que el único que varíe su ancho sea el "main".
Además, FireFox destroza tu código :s

Imagino que habrá que jugar con div's anidados y la posición relativa y absoluta. Pero no logro dar con la configuración correcta.

Respecto a lo de la publi de Geocities... no es el problema, porque todo esto lo pruebo siempre en local, es decir, sin publi.

Gracias, de nuevo, por vuestro aporte. Habrá que seguir indagando.