Column Layouts Clearfixes and Vertical-Spacers Last Updated September 2024 Using Clearfix and Vertical Spacers with Pre-Formatted 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 Place your content for the first column here. Place your content for the second column here. 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 Place your content for the first column here. Place your content for the second column here. 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 Place your content for the first column here. Place your content for the second column here. 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.
