Foros del Web » Creando para Internet » CSS »

uso de FLOAT

Estas en el tema de uso de FLOAT en el foro de CSS en Foros del Web. Hola! tengo un problema. En el codigo que voy a poner con el mensaje tengo una caja en VERDE (class="bottom") que quiero que se ubique ...
  #1 (permalink)  
Antiguo 21/03/2007, 23:25
 
Fecha de Ingreso: marzo-2007
Mensajes: 3
Antigüedad: 10 años, 8 meses
Puntos: 0
Pregunta uso de FLOAT

Hola! tengo un problema. En el codigo que voy a poner con el mensaje tengo una caja en VERDE (class="bottom") que quiero que se ubique justo ABAJO de las cajas ROJA (class="left") y AMARILLA (class="right"). En firefox, la caja verde se situa detras de la caja roja, y en explorer se situa entre ambas.
Cabe señalar que la caja mas alta puede llegar a ser tanto la amarilla como la roja, y que quiero la caja verde justo abajo de estas dos sin que se superponga a nada; tambien estaria bien decir que no se de antemano el alto de la caja roja ni de la amarilla.
Por favor, necesito ayudaaa!!!!
Gracias!


<html>
<head>
<style type="text/css">
.left {
float: left;
width: 100px;
height: 100px;
background-color:#dd1111;
}
.right {
float: right;
width: 200px;
height: 200px;
background-color:#eeee00;
}
.bottom {
width: 300px;
height: 300px;
background-color:#00aa00;
}
.container {
height: 610px;
width: 610px;
background-color:#777777
}
</style>
</head>

<body>
<div class="container">
<div class="left"></div>
<div class="right"></div>
<div class="bottom"</div>
</div>
</body>
</html>
  #2 (permalink)  
Antiguo 22/03/2007, 01:17
Avatar de sumolari  
Fecha de Ingreso: mayo-2006
Ubicación: localhost
Mensajes: 1.367
Antigüedad: 11 años, 7 meses
Puntos: 18
Re: uso de FLOAT

pues pon una capa entre la de clase left y la de clase right. Tuve un problema parecido, con una capa que estaba en la derecha, no se "mueve" si no hay otra capa que osupe el espacio que va a "dejar".
Ahh! La capa que está entre la izquierda y derecha ha de ser igual de alta que estas, ya que sino la capa inferior tendrá un trozo entre las dos capas y otro en la parte inferior.
¡Suerte!
  #3 (permalink)  
Antiguo 22/03/2007, 03:08
Avatar de PatomaS
Colaborador
 
Fecha de Ingreso: marzo-2004
Ubicación: En alguna otra parte
Mensajes: 4.656
Antigüedad: 13 años, 9 meses
Puntos: 63
Re: uso de FLOAT

Hola

Tras posicionar cosas con float, debes usar clear para que la siguiente capa quede debajo, bastar'a con que agregues clear: both; a la clase bottom.

Felicidad
  #4 (permalink)  
Antiguo 22/03/2007, 07:39
 
Fecha de Ingreso: marzo-2007
Mensajes: 3
Antigüedad: 10 años, 8 meses
Puntos: 0
De acuerdo Re: uso de FLOAT

Muchas gracias PatomaS, tu solucion es justo lo que estaba buscando. Se agradece tambien la cooperacion de sumolari, pero lo otro es una sola linea y no tengo que calcular nada, asi que para mi eso del "clear" es lo mas optimo.
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 12:32.