There are many ways to create a layout in CSS. This chapter will look at some of these methods and how they compare when creating a simple layout.
Float
In the early days of CSS one of the few available methods for creating a grid-like design was to use the float property to get block elements to stay on the same line.
.left { float: left; }
.clear { clear: both; }
To show the effect of floating elements the following box style will be used.
.box {
width: 100px;
height: 100px;
margin: 1em;
background: #ccc;
}
Clearing issues and browser inconsistencies aside, the float property provided a non-intuitive ...
