sábado, noviembre 23, 2024
Inicio CSS - Diseño Capas flotantes con CSS

Capas flotantes con CSS

0

Una propiedad que me ha solucionado el 95% de los problemas de organización es Float, que permite ajustar texto alrededor de un elemento. Esto es idéntico en propósito a align=left y align=right para el elemento IMG de HTML 3.2, pero CSS1 permite que todos los elementos «floten».

Uno de los ejemplos que suelo utilizar es la división del documento html en dos partes; derecha e izquierda, con tan solo definir la propiedad Float en «left» o «right».

Copiar el siguiente ejemplo para obtener las capas flotantes:

<html>
<head>

<style type=»text/css»>
body {margin:0}
#izquierda {background: green; width:50%; height:100%; float: left}
#derecha {background: red; width:50%; height:100%; float: right}
</style>

</head>
<body>

<div id=»izquierda»>Contenido del lado Izquierdo o columna Izquierda</div>
<div id=»derecha»>Contenido del lado derecho o columna Derecha</div>

</body>
</html>

Ver Ejemplo

Este ejemplo fue agregado vía CSSboulevar, el cual es un sitio asociado a DotNetcr.com. Recuerda visitar este interesante sitio dedicado a brindar ayuda en Hojas de Estilo.
CSSboulevar, www.cssboulevar.com.ar

Dejar respuesta

Please enter your comment!
Please enter your name here