Tema: Problemas con DIV en navegadores
Ver Mensaje Individual
  #1 (permalink)  
Antiguo 30/05/2006, 11:49
atoon
 
Fecha de Ingreso: agosto-2002
Ubicación: Sí
Mensajes: 49
Antigüedad: 21 años, 8 meses
Puntos: 0
Problemas con DIV en navegadores
Éstas páginas se ven bien en explorer pero no se ven igual en Firefox. Principalemente por que no se ven centradas las div y una div se pone debajo de otra na' que ver en la segunda página.

Código HTML:
<html>
<head>
<title>Comunidad Oficial de 31 Minutos</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
.cgl {
	left: 3px;
	top: 3px;
	right: 3px;
	bottom: 3px;
	background-color: #E9E9E9;
	border: 1px solid #999999;
}
a {
	color: #0073BF;
	text-decoration: underline;
}
body,td,th {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10pt;
}
th {
	background-color: #FFCC00;
}
#alt {
	background-color: #E0E0E0;
}
#headsegundo {
	background-color: #CCCCCC;
	font-weight: bold;
}
h1, h2 {
	border-top: 0px solid;
	border-right: 0px solid;
	border-bottom: 1px solid #FFCC00;
	border-left: 0px solid;
}
#wewo {
	border: 2px #000000;
}
.ven {
	margin: 9px;
}
.flass {
	border: 2px solid #000000;
	height: 150px;
	width: 600px;
}
body {
	text-align: center;	  
      }
.centertodo {
		width: 100%;
	text-align: center;
	overflow: visible;
}
body,td,tr {
	background-color: #3399FF;
}
.bgg {
	color: #FFFFFF;
	background-color: #000000;
	font-size: x-small;
	width: 600px;
	border-top-width: 0px;
	border-right-width: 2px;
	border-bottom-width: 0px;
	border-left-width: 2px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #000000;
	border-right-color: #000000;
	border-bottom-color: #000000;
	border-left-color: #000000;
}
.bgg a {
	color: #FFCC00;
	font-weight: bold;
}
.conte {
	background-color: #FFFFFF;
	border-right-width: 2px;
	border-left-width: 2px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #000000;
	border-right-color: #000000;
	border-bottom-color: #000000;
	border-left-color: #000000;
	width: 600px;
	border-top-width: 2px;
	border-bottom-width: 2px;
	text-align: left;
}
.paddingnueve {
	padding: 9px;
}
.float {
	float:right;
	overflow:hidden;
	display:inline;
	width: 170px;
	margin-left: 9px;
	font-size: x-small;
}
.cdee {
	background-color: #000000;
	width: 600px;
	font-size: x-small;
	color: #FFFFFF;
	border-top-width: 0px;
	border-right-width: 2px;
	border-bottom-width: 2px;
	border-left-width: 2px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #000000;
	border-right-color: #000000;
	border-bottom-color: #000000;
	border-left-color: #000000;
}
.cgl ul {
	text-indent: 0px;
}
.ulg {
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
}

-->
</style>
</head>

<body>
<div class="centertodo">
<div class="flass">
  <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="" width="600" height="150" align="middle">
    <param name="allowScriptAccess" value="sameDomain" />
    <param name="movie" value="header.swf" />
    <param name="menu" value="false" />
    <param name="quality" value="high" />
    <param name="bgcolor" value="#ffffff" />
    <embed src="header.swf" menu="false" quality="high" bgcolor="#ffffff" width="600" height="150" align="middle" allowscriptaccess="sameDomain" type="application/x-shockwave-flash" pluginspage="" />  
</object></div>
<div class="bgg"><a href="">  H</a><a href="">ome</a> | <a href="home.php?home=episodios" class="style3">Gu&iacute;a de episodios</a> | <a href="home.php?home=leseras">Leseras</a> | <a href="home.php?home=merchandising">Merchandising</a> | <a href="home.php?home=articulos">Art&iacute;culos</a> | <a href="home.php?home=links">Links</a> | <a href="">Foro externo</a> | <a href="">Sofoca.cl</a></div>
<div class="conte"><div class="paddingnueve">&iexcl;Bienvenidos a la nueva nueva p&aacute;gina de la Comunidad Oficial de 31 Minutos!</p>
    <div class="float">
      <div class="cgl">
        <div class="paddingnueve">
        <strong>Actualizaciones  </strong></p>
          <ul class="ulg"><li><strong>15/03/2006</strong> El regreso de las secciones <a href="home.php?home=articulos">Art&iacute;culos</a> y <a href="home.php?home=links">Links</a> con nuevas cuestiones. Las secciones <a href="home.php?home=rankingtop">Ranking Top y otras canciones</a>, <a href="home.php?home=merchandising">Merchandising</a> y <a href="home.php?home=cd">CD</a> tienen arreglitos.</li>
            <li><strong>10/02/2006</strong> La nueva <a href="home.php?home=leseras">lesera</a> <a href="home.php?home=rankingtop">Ranking Top y otras canciones</a>, actualizadas las <a href="home.php?home=cancionesprestadas">canciones prestadas</a>, el <a href="home.php?home=merchandising">merchandising</a>, la secci&oacute;n <a href="home.php?home=cd">CD</a> y reconceptualizaci&oacute;n de la <a href="home.php?home=guiadeepisodios">Gu&iacute;a de episodios</a>,</li>
          </ul>
    </div></div></div>
    <h2 align="left">Nuevo</h2>
<span class="style3"><strong>10/02/20006</strong></span>
<p align="left">&iexcl;Hola! La p&aacute;gina de 31 Minutos m&aacute;s querida por la gente ha vuelto en gloria y majestad a la internec. Con un genial nuevo dise&ntilde;o y reseteo de los contenidos, esperamos iniciar ese nuevo ciclo para la p&aacute;gina cada vez mejor y todo eso. Aprovechando que este a&ntilde;o es medio &quot;sab&aacute;tico&quot; para 31 Minutos, tomando en cuenta que no hay temporada y lo &uacute;nico programado es la pel&iacute;cula, aprovechamos de tomarnos un tiempo de renovar todo el contenido y el dise&ntilde;o y la p&aacute;gina en general.</p>
<p align="left"> Antes de todo esto, hab&iacute;amos estado medio apretados en el servidor, con el espacio y el ancho de banda totalmente carneados; aparte del cambio de hosting, la inclusi&oacute;n de un foro externo ayudar&aacute; a que la p&aacute;gina fluya m&aacute;s mejor y de este modo se podr&aacute;n tener actualizaciones m&aacute;s frecuentes.</p>
<p align="left">
  <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="" width="468" height="60">
    <param name="movie" value="bd.swf">
    <param name="quality" value="high">
    <embed src="bd.swf" quality="high" pluginspage="" type="application/x-shockwave-flash" width="468" height="60"></embed>
  </object>
</p>
<a href="#top">Volver arriba</a>
</div></div><div class="cdee">31 Minutos, personajes, nombres y toda indicia relacionada son marca registrada de Aplaplac Ltda. </div>
</div>
</body>
</html>
Código HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"">
<html>
<head>
<title>Documento sin t&iacute;tulo</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
.dd {
	background-image: url(images/Untitled-D1_03.gif);
	background-repeat: no-repeat;
	background-position: left top;
	width: 170px;
	height: 110px;
	float:left;
	overflow:hidden;
	display:inline;
}
.ff {
	background-image: url(images/Untitled-D1_05.gif);
	background-repeat:   repeat-y;
	background-position: left top;
	width: 430px;
	height: 110px;
	float:right;
	display:inline;
}
.sss {
	text-align: center;
	vertical-align: top;
	height: 110px;
	width: 600px;
}
.ss {
	background-color: #FF4040;
	background-image: url(images/Untitled-D1_07.gif);
	background-repeat: no-repeat;
	background-position: left top;
	min-height: 100%;
	width: 170px;
	float:left;
	overflow:auto;
	display:inline;
	clear: both;
	margin: 0 auto;
	color: #FFFFFF;
}
.sps {
	padding: 19px;
}
.spspp {
	padding: 9px 0px 0px;
}
body,td,tr {
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 10pt;
	color: #000000;
	background-color: #E3E3C6;
}
.hj {
	background-color: #FFFFFF;
	min-height: 100%;
	width: 421px;
	margin-left: 9px;
	float:right;
	display:inline;
}
.ss a {
	color: #FFCC00;
}
.hj a {
	color: #0033FF;
}
.post24 {
	text-align: center;
	min-height: 100%;
	width: 600px;
}
.post24 > .hj {
	min-height: 100%;
	height: auto;
}
.post24 > .ss {
	min-height: 100%;
	height: auto;
}
.eed {
	text-align: center;
}
.ssss {
	text-align: center;
	vertical-align: top;
	width: 600px;
}

</style>
<link href="lll.css" rel="stylesheet" type="text/css">
</head>

<body>
<div class="eed">
<div class="sss">
<div class="dd"></div>
<div class="ff"></div>
</div>
<div class="post24">
<div class="ss">
  <div class="sps">
    <p>&nbsp;</p>
    </div>
</div>
<div class="hj">
  <div class="sps">
    <p>&nbsp;</p>
    </div>
  </div>
</div>
<div class="ssss">
  <div class="spspp"><a href=""><img src="images/Untitled-g1.gif" width="170" height="21" border="0"></a><br>
    P&aacute;gina 100% Shilena</div>
</div>
</div>
</body>
</html>