Float Right - cleared right
<!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"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title></title> <style type="text/css" media="Screen"> * .float { margin: 0px 10px; width: 120px; background-color: yellow; color: black; } * .left { float: left; background: red; } * .right { float: right; background: gold; } * .clear-left { clear: left; background: yellow; } * .clear-right { clear: right; background: pink; } * .clear-both { clear: both; background: blue; color: white; } * .clear-none { clear: none; background: gray; } </style> </head> <body> <div> <p class="clear-none">This paragraph does not clear floats. <span class="float right clear-right">Float Right - cleared right</span> </div> </body> </html>