Twitter Bootstrap - Position issue with row-fluid

Answer 1

Your 2 examples actually have 4

within a full-width 'row'... adding up to '24', or twice the width meant for a 'row' or 'row-fluid', based on the 12 column grid setup. You're basically creating dropping floats when there are too many to fit within the parent row's width. (This is also why it seems that 'margin-left:0' is not being applied to your 3rd 'span6', which looks like it's the first 'span6' of a 2nd row.)

In a default/fixed 'row', the nested column's 'span*'s + 'offset*'s will need to be less than or equal to its parent's column 'span*', OR if it's a first-level row, then 12, because the floated 'span*' widths are in pixels.

In a flexible/fluid 'row-fluid', the column widths are set by percentage, so each row and nested row can have nested column 'span*'s and 'offset*'s that add up to 12, each time. http://twitter.github.com/bootstrap/scaffolding.html#fluidGridSystem

This should solve your issue with the 'row-fluid' setup. http://jsfiddle.net/csabatino/uAs6k/9/

NOW this is working.

    
Content
    
Content


    
Content
    
Content



Default fixed 'row' is working, too.

    
Content
    
Content


    
Content
    
Content