CSS: Floating a Column under another Floated Column

Discussion in 'CSS Forum' started by davidsonmule, Apr 10, 2013.

  1. davidsonmule

    davidsonmule New Member

    I'm trying to do some maintenance on a site, and I noticed one page is a bit out of whack. Their is a container div for a column on the left, and a container div for content on the right, with another container for overall page content. At the bottom of the page, but before the footer, there are three columns in a row, and they fall into the main container, all in separate divs (same div class), all floated left.This works fine on every page except for one. The content on the right is not enough to push the three columns down below the big column on the left. So what you get is two columns in a row floated against the big column on the left, instead of against the container, with the third column floating below the second column.The CSS for the three smaller columns is:\[code\].FBG .blok { width:270px; float:left; padding:5px 20px; margin:0;}\[/code\]It's the same code on every page, but like I said, the difference on this page is that there is not enough content in the right div to push the columns down.Is there any way to code sensibly around this issue? Or will I need to add yet another nested div to this page? Thanks for any response!
     

Share This Page