Foros del Web - Ver Mensaje Individual

Eourus · #1 (**permalink**) 27/10/2006, 03:22

Estoy realizando una nueva versión de mi web.

Tiene 2 columnas, utilizan la propiedad float.

He podido comprobar que en algunos navegadores firefox, la columna de la izquiera (contenido), a veces se desplaza hacia abajo, sin embargo, cuando refrescas, vuelve a subir.

He pensado que puede ser un bug de firefox.

Copio y pego el código (he tenido que quitar algunas url porque no me deja subirla por tener menos de 30 mensajes).

Cita:

<html lang="es">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="Description" content="Tienda de productos Herbalife para mantenerte sano y en forma" >
<meta name="Keywords" content="Nutrición, Herbalife, productos, sanos, cuerpo, deporte, físico, atletas, dieta, comida, sana, nutrirse, tienda, online" >
<meta name="Robots" content="all" >
<title>Nutriéndose</title>
<link href="/prueba2/css/generico.css" rel="stylesheet" type="text/css">
<link rel="shortcut icon" href="/favicon.ico">
</head>

<body>
<div id="cabecera">
<div id="cabizq"> </div>

<div id="cabdrc"> </div>
<div id="titulo">
<div style="width:95%; margin:auto; padding-top:10px;">
<h1>Nutriéndose.com</h1>
Un estilo de vida saludable
</div>
</div>
<div id="login">

<br/>

<form action="perfil.php" method="post" name="acceder">
<label for="user">Usuario:</label><br/>
<input type="text" name="usuario" value="user" id="user" maxlength="10"><br/>
<label for="pass">Contraseña:</label><br/>
<input type="password" name="password" value="pass" id="pass" maxlength="10"><br/><br/>
<input type="submit" name="enviar" value="Entrar">
</form>

</div>

</div>
<div id="bloque">
<div id="menulatdrc">
<h2>Menú Principal</h2>
<ul class="navi">
<li><a href="index.php">Inicio</a></li>
<li><a href="quienes.php">Quienes sómos</a></li>
<li><a href="comocomprar.php">Como comprar</a></li>

<li><a href="crearcuenta.php">Registro</a></li>

<li><a href="contacto.php">Contactar</a></li>
</ul>
<h2>Productos</h2>
<ul class="navi">
<li><a href="productos.php?cat=4">Control de peso</a></li>
<li><a href="productos.php?cat=1">Nutrición</a></li>

<li><a href="productos.php?cat=3">Nutrición para deportistas</a></li>
<li><a href="productos.php?cat=2">Cuidado de la piel</a></li>
<li><a href="productos.php?cat=5">Cuidado del cabello</a></li>
<li><a href="productos.php?cat=6">Fragancias</a></li>
</ul>
<h2>Más Información</h2>

<ul class="navi">
<li><a href="noticias.php">Noticias</a></li>
<li><a href="documentos.php">Artículos</a></li>
<li><a href="enlaces.php">Enlaces de interés</a></li>
<li><a href="calendario.php">Calendario</a></li>
<li><a href="faq.php">Preguntas y respuestas</a></li>

</ul>
<br/>

</div>
<div id="contenido">


<div id="seccion"><h2>Productos</h2></div>
<br>


</div>
</div>
<div id="pie">Copyright © 2006 Nutriendose.com</div>
</body>
</html>

Cita:

/* CSS Document */

body {

margin:0px;

margin-top:5px;

font: 11px arial;

color:#666;

background:#426E48;

}

h1 { padding:0; margin:0; color: #FFF; background: inherit;font: bold 34px Arial; letter-spacing: -1px; }

h2 { background-color: inherit; color:#FF8D00; font-size:15px; font-weight:bold; margin: 0px 0 10px 0; padding:0; }

h2 a { color: #FF8D00; }

h2 a:hover { color: #EE8300; text-decoration: none;}

h3 { background-color: inherit; color:#666; font-size:11px; font-weight:bold; }

h3 a { color: #666; text-decoration:none; }

h3 a:hover { color: #666; text-decoration: none;}

input, select { border:1px solid #ccc; font: 11px arial; color:#666; }

hr { border:0px; border-top:1px dashed #ccc;}

a { color: #666; text-decoration:none; }

a:hover { text-decoration:underline; }

fieldset { border:1px solid #ccc; padding:5px; }

img { border:0px; }

iframe { width:100%; height:750px; border:0px; }

form { padding:0px; margin:0px; }

/* capas */

#cabecera {

width:760px;

margin:auto;

background:#2EAC50;

}

#cabizq {

width:580px;

height:20px;

background:#1C7935;

float:left;

}

#cabdrc {

width:180px;

height:20px;

background:#2EAC50;

float:right;

}

#titulo {

background:#2EAC50 url(../img/header.jpg);

width:580px;

height:120px;

float:left;

font-size: 16px;

color:#fff;

}

#login {

width:160px;

height:120px;

padding-left:10px;

padding-right:10px;

float:right;

background:#B3E6BB;

}

#bloque {

width:760px;

margin:auto;

background: #fff url(../img/fondo.gif);

clear:both;

display:table;

}

#menulatdrc {

float:right;

width:160px;

margin-top:10px;

padding-left:15px;

padding-right:5px;

}

.navi {

list-style:none;

margin-left:0px;

margin-right:0px;

margin-top:0px;

margin-bottom:15px;

padding:0px;

}

.navi li {

margin:0px;

padding:2px;

border-bottom:1px dashed #ccc;

}

.navi li:hover {

background:#C6EFC8;

}

.navi a {

color:#003366;

text-decoration:none;

}

.navi a:hover { text-decoration:none; }

#contenido {

float:left;

width:560px;

padding:10px;

text-align:justify;

}

#seccion { border-bottom:1px dashed #ccc;}

.not { width:100%; padding-bottom:10px; border-bottom:1px solid #ccc; }

#noticias {float:left; width:49%; padding-bottom:10px; padding-top:20px;}

#noticias ul { list-style-image:url(../img/arrow.gif); margin:0px; padding:0px; }

#noticias li { margin:0px; padding:0px; margin-left:17px;}

#articulos {float:right; width:49%; padding-bottom:10px; padding-top:20px;}

#articulos ul { list-style-image:url(../img/arrow.gif); margin:0px; padding:0px; }

#articulos li { margin:0px; padding:0px; margin-left:17px;}

#pie {

width:760px;

height:20px;

margin:auto;

clear:both;

background:#2EAC50;

text-align:center;

color:#fff;

}

/* Otros */

.colum1 {

width:49%;

float:left;

height:192px;

border-bottom:1px solid #ccc;

padding-top:5px;

}

.colum2 {

width:49%;

float:right;

margin-top:-14px;

height:192px;

border-bottom:1px solid #ccc;

padding-top:5px;

}

.boton, .boton:hover {

border:1px solid #ccc;

background:#f7f7f7;

padding-left:3px;

padding-right:3px;

text-decoration:none;

}