Descripción
El claro evita que un elemento se muestre junto a elementos flotantes.
Valores posibles
none - Los elementos flotantes pueden aparecer a ambos lados del elemento.
left - Los elementos flotantes pueden no aparecer a la izquierda del elemento.
right - Los elementos flotantes pueden no aparecer a la derecha del elemento.
both - Los elementos flotantes pueden no aparecer en ninguno de los lados del elemento.
Se aplica a
Todos los elementos a nivel de bloque.
Sintaxis DOM
object.style.clear = "top";
Ejemplo
Aquí está el ejemplo que muestra el efecto de esta propiedad:
<html>
<head>
<style type = "text/css">
div.float {
border:1px solid #ff9900;
width:120px;
float: right;
}
div.clear {
border:1px solid #cccccc;
width:120px;
clear: right;
}
</style>
</head>
<body>
<div class = "float">
This div has float set.
</div>
<div class = "clear">
<p>
This div has the CSS clear property set.
</p>
<p>
Try changing the CSS clear values to see the effect it has on the position of the div boxes.
</p>
</div>
</body>
</html>
Esto producirá el siguiente resultado: