Question

我知道机会很小，但是你会如何实现如下布局：左侧，中间和右侧使用自举网格系统时有不同的背景颜色？我想列布局与Bootstrap网格的思路相反，我是对的吗？

Here's an online use case url

CSS是用于跨度等的标准Bootstrap网格CSS。

我查看了其他一些SO Q和A，但我不想使用像JavaScript这样的东西......或IE7 +不支持的东西..

Answer 1

来自@Omega的解决方案看起来不错，这是另一种选择：http://jsfiddle.net/panchroma/u5XGL/

这里CSS的重要部分是如何获得具有不同内容高度的列的背景颜色。

我为每一列添加了一个大的填充和一个同样大的负边距，然后将整个行包装在一个隐藏溢出的类中。

CSS

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

.col-wrap{
overflow: hidden; 
}

你会发现它很好，也是一个很好的跨浏览器解决方案。

祝你好运！

Answer 2

当然，只需使用这个CSS：

html, body, .container-fluid, .row-fluid, .blue, .lightgrey {height:100%;}