CSS: Como usar el Float y el Clear y no perder la cabeza 3
Uno de los dolores de cabeza mas fuertes cuando estamos maquetando con CSS en un sitio es el uso del atributo float en nuestras capas ya que si estan contenidas dentro de otra capa esta usualmente no converva la altura de la capa que tiene el atributo float.
Como evitar esto? en donde lo podemos utilizar? pues bueno las repuesta son las siguientes:
Como evitar esto?
Utilizando un capa extra con el atributo clear:both;
-
.clearfix{
-
clear:both;
-
}
En donde lo podemos utilizar?
En un template con mas de una columna.
En un calendario ya ven que son cuadritos consecutivos dentro de un contenedor.
o incluso en un ordenamiento de bloques como el que utiliza los startups como netvibes.
-
.contenedor{
-
border:1px solid #cccccc;
-
padding:2px;
-
margin:2px;
-
}
-
-
.capa{
-
border:1px dashed #cccccc;
-
background:#f2f2f2;
-
width:110px;
-
height:110px;
-
float:left;
-
}
-
-
.clear{
-
clear:both;
-
}
Espero estos tips les sean utiles y si hay dudas pues solo pregunte ![]()
Suscribete al Feed
Agregar en Netvibes
Agregar en Bloglines
Agregar en Technorati
Agregar en iGoogle
Agregar en MyYahoo!
Meneame
StumbleUpon
Designios
DesignFloat
Del.Icio.Us
Digg
Mister Wong
Fresqui




