NOTICE: This website is no longer updated or supported - as such many of the techniques used to build it may seem antiquated in the modern day. It is preserved for historical reasons only.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<title>Float and Clear Control under CSS</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />

<style type="text/css">
<!--
p.aligned-right { border-style: solid;
 border-width: 1px;
 height: 100px;
 width: 100px;
 background-color: yellow;
 float: right; }
.clearright { clear:right; }
-->
</style>

</head>
<body>

<div>
This is some dummy text.

<p class="aligned-right">A floating region</p>

Here is some more text. It should keep going next to the paragraph for a while. Here is some more text. It should keep going next to the paragraph for a while.<br class="clearright" />

This text should appear after the floating section.
</div>

</body>
</html>

CLOSE WINDOW | VIEW RENDERED PAGE