La propiedad
floatespecifica cómo debe flotar un elemento.
La propiedadclearespecifica qué elementos pueden flotar junto al elemento borrado y en qué lado.
La propiedad float
La propiedad float se utiliza para posicionar y dar formato al contenido. Por ejemplo, deje que una imagen flote a la izquierda del texto en un contenedor.
La propiedad float puede tener uno de los siguientes valores:
left- El elemento flota a la izquierda de su contenedor.right- El elemento flota a la derecha de su contenedor.none- El elemento no flota (se mostrará justo donde aparece en el texto). Esto es predeterminado.inherit- El elemento hereda el valor flotante de su padre.
En su uso más simple, la propiedad float se puede usar para envolver texto alrededor de imágenes.
Ejemplo float: right;
El siguiente ejemplo especifica que una imagen debe flotar hacia la derecha en un texto:
Ejemplo:
Ejemplo float: left;
El siguiente ejemplo especifica que una imagen debe flotar a la izquierda en un texto:
Ejemplo:
Ejemplo nofloat
En el siguiente ejemplo, la imagen se mostrará justo donde aparece en el texto (float: none;):
Ejemplo:
Ejemplo float al lado de otro
Normalmente, los elementos div se mostrarán uno encima del otro. Sin embargo, si usamos float: left; podemos dejar que los elementos floten uno al lado del otro:
Ejemplo:
Resumen
La propiedad CSS float se utiliza para posicionar y dar formato al contenido, permitiendo que los elementos floten a la izquierda o a la derecha de su contenedor. También se puede usar para envolver texto alrededor de imágenes y para mostrar elementos div uno al lado del otro.
Traducido con 💚 desde W3Schools.com