好的,使用最新版本的Bootstrap
尝试将我的ROR应用程序中的列设置为背景色。
这是代码(在HAML中)
.row.testing
.col-lg-2
= render 'blah/blah_testing/
= yield :sidebar
.col-lg-10
= yield
我试图使
col-lg-2
列完整地显示背景色,而不管有多少行,否则当最后一行停止时它就会停止。高度是动态的。宽度由引导程序设置。而且我不认为我可以使用表格设置来设置列的背景,因为这似乎依赖于固定的度量?
编辑
广泛地简化了这个问题。
最佳答案
代替height:100%使用视口高度。
您可以将height:100%用于列,但是在CSS中也必须将主体的高度设置为100%。麻烦的是,一旦我发现了视口单元,就从此不再使用它。
或者,如上所述,您可以使用一个称为vh的新CSS元素(对“ CSS vh unit”进行快速搜索,如果您想了解更多内容,将会得到更好的解释。[还有其他视口如果您进一步阅读,可以找到一些度量值])
无论如何,要为您的行指定一个ID,例如id="myRow"
,然后将其在CSS中的高度设置为height: 100vh
一个VH单位等于屏幕尺寸的1%。因此100vh将是整个屏幕的高度,50vh将是整个屏幕的高度。 (本单元应该是动态的,但是我相信到目前为止,只有最新版本的Firefox才内置支持...但是自从阅读Viewport测量文档以来已经有一段时间了。)
这是一个方便的链接/说明以结帐
https://css-tricks.com/viewport-sized-typography/
关于html - Twitter Bootstrap列背景色,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/29958031/