mx482 Posted August 12, 2009 Share Posted August 12, 2009 I'm a little confused about this...The definition says that right: no floating elements allowed on the right sideleft: no floating elements allowed on the left sideboth: no floating elements allowed on either the left or the right side.If you paste this code into your page and run, it will display three boxes. All the boxes will be adjacent on the same line (all floated left) even though the middle box has the instruction to not allow any floating elements on the right side.It must be my interpretation because you can experiment with putting clear: both in the middle box as well and it also doesn't display what I would expect.Please set me straight. Thanks.<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html lang="en"><head><meta http-equiv="content-type" content="text/html; charset=iso-8859-1"><style type="text/css">div.one { border:1px solid #ff9900; width:120px; float:left;}div.two { border:1px solid #cccccc; width:120px; float: left; clear: right;}div.three { border:1px solid #cccccc; width:120px; float: left;}</style></head><body><div class="one"></div><div class="two"></div><div class="three"></div></body></html> Link to comment Share on other sites More sharing options...
jeffman Posted August 12, 2009 Share Posted August 12, 2009 The clear property defines how an element will be positioned with respect to the element that comes before it, not the element that comes after. So putting clear:right in the middle box does nothing, because there is no previous element floating to its right. Putting clear:both in the middle box causes the middle box to begin on a new line; it is clearing the box that would have been to its left. Link to comment Share on other sites More sharing options...
mx482 Posted August 12, 2009 Author Share Posted August 12, 2009 Thank You!I knew I was missing something. Wish the documentation would make it a little clearer. Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.