找到你要的答案

Q:Bootstrap same height column without removing float

Q:不移除浮动的引导高度列

I have a jsfiddle here - https://jsfiddle.net/6cascyr8/

I need the columns to be the same height.

I would normally do this with display table and removoing the float.

The content is created in a loop and sometimes some of the columns in the row are empty like the bottom row in the example.

Becuase the float is removed the the colums are centered.

Is there a way to have columns with the same height without removing the float.

The columns have dynmic content so I can't set there height.

    .the-table{
        display:table;
        border-spacing:20px;
    }

    .the-cell{
        color: white;
        float:none;
        display:table-cell;
        background:red
    }

我这里有一个https://jsfiddle.net/6cascyr8/ JSFiddle

我需要列是相同的高度。

我通常会做这显示表和removoing浮。

内容在循环中创建,有时行中的一些列与示例中的底部行一样为空。

因为是漂浮辗转的柱为中心。

是否有一个方法,具有相同的高度,而不删除浮动的列。

列有动态内容所以我不能设置有高度。

    .the-table{
        display:table;
        border-spacing:20px;
    }

    .the-cell{
        color: white;
        float:none;
        display:table-cell;
        background:red
    }
answer1: 回答1:

The below CSS should take care of left aligning the table cells

.the-table:before {
    content: normal !important;   
}

However, you'll see an alignment problem in the cells because of your border-spacing: 20px. Replace that by a combination of (thick white) borders on your cells and perhaps padding on the rows.

下面的CSS应该照顾左对齐的单元格

.the-table:before {
    content: normal !important;   
}

然而,你会看到在细胞的对准问题因为你的边界间距:20px。在单元格上用组合(厚白色)边框替换,或者在行上填充。

css  twitter-bootstrap