Twitter Bootstrap - Same heights on fluid columns

后端 未结 1 1054
借酒劲吻你
借酒劲吻你 2020-12-13 15:52

Is it possible to get two fluid column wells with uneven column data length to be the same height?

相关标签:
1条回答
  • 2020-12-13 16:34

    Here's a responsive CSS solution, based on adding a large padding and an equally large negative margin to each column, then wrapping the entire row in in a class with overflow hidden.

    .col{
    margin-bottom: -99999px;
    padding-bottom: 99999px;
    background-color:#ffc;
    }
    
    .col-wrap{  
    overflow: hidden;   
    }
    

    You can see it working at jsFiddle

    EDIT

    A variation if you want equal height wells or columns with rounded corners:
    http://jsfiddle.net/panchroma/4Pyhj/

    EDIT

    Another variation with equal height wells or columns with rounded corners, this time for Bootstrap 3
    http://jsfiddle.net/panchroma/D4xdE/

    It's more or less the same as with Bootstap 2, but with some refinements to accomodate a change in how BS spaces the column grids now.

    0 讨论(0)
提交回复
热议问题