viernes, junio 12, 2026

Capas flotantes con CSS

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




Roy Rojashttp://www.dotnetcr.com
Con más de 20 años de experiencia en programación, experto en lenguajes .NET, VB, C#, ASP.NET, Xamarin, XCode, DBA en SQL Server. Creador de dotnetcr.com, sitio web para programadores en español. royrojas.com | dotnetcr.com | GitHub

Redes Sociales

2,736FansMe gusta
326SeguidoresSeguir

Popular esta semana

Salto de línea en aplicaciones VB.NET

Ejemplo muy simple pero que generalmente se está utilizando, como hacer los saltos de línea en nuestros Strings.

Últimos artículos

SQL Server MERGE

MERGE in SQL Server for Insert, Delete and Update with two tables

Practical example using MERGE to synchronize two tables, Insert, Update and Delete in a single query. Valid for SQL SERVER 2008 or...

Como crear una API REST con ASP.NET Core 6.0

Crear una API REST con C# en ASP.NET es un proceso sencillo y rápido que permite exponer un conjunto de recursos a...
Machine Learning & Python

Introducción a Machine Learning en Python

Machine Learning es una rama de la inteligencia artificial que se enfoca en el desarrollo de sistemas que pueden aprender de...
SQL Server MERGE

MERGE en SQL Server, como utilizarlo de forma sencilla

El comando MERGE en SQL Server se utiliza para combinar datos de varias tablas en una sola tabla. Es útil para actualizar...