Using Clearfix and Vertical Spacers with Pre-Formated Variable width Columns
The following demo shows how a clearfix can eliminate the odd behavior when floats interact with other page content. We have also provided a demonstration of how the vertical-spacer combined with a clearfix offers some additional formatting. For this demo, we are using the 1/3 -2/3 layout from the advanced layouts section.
No Clearfix or Vertical-Spacer
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris et lobortis lorem. Sed urna nisl, ullamcorper id massa eget, lacinia ullamcorper eros. Ut viverra dolor magna, at lacinia lectus faucibus eu. Fusce sit amet blandit orci. Vestibulum vehicula ligula in neque aliquam rutrum.
With a Clearfix
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris et lobortis lorem. Sed urna nisl, ullamcorper id massa eget, lacinia ullamcorper eros. Ut viverra dolor magna, at lacinia lectus faucibus eu. Fusce sit amet blandit orci. Vestibulum vehicula ligula in neque aliquam rutrum.
With a Clearfix and a Vertical-spacer
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris et lobortis lorem. Sed urna nisl, ullamcorper id massa eget, lacinia ullamcorper eros. Ut viverra dolor magna, at lacinia lectus faucibus eu. Fusce sit amet blandit orci. Vestibulum vehicula ligula in neque aliquam rutrum.