我有一个container-fluid
容器元素,并且一直使用row
而不是row-fluid
,诚然是出于无知。
现在我正在尝试替换{{} 1}}具有row
类的类,但遇到了一些问题。
首先,我看了row-fluid
宽度是如何在.less中定义的,它对我来说是完全象形文字的,所以有人愿意解释吗?
更重要的是,当我用row-fluid
替换行时,元素的高度会折叠为0,要求我包含.clearfix类,以便row-fluid元素增长到包含它儿童专栏。为什么这是必要的,即什么是浮动以及为什么当我用row-fluid
替换row
时?除了讽刺row-fluid
(我做过)之外,任何输入都会非常感激。
答案 0 :(得分:6)
这取决于你想知道宽度的元素。 row-fluid
类本身的宽度为100%
。跨度(或列)具有相对宽度,以这样的方式设置,它结合到100。
浮动:所有列都浮动,这就是它的流动性。 row-fluid
唯一与身高相关的事情是设置min-height: 30px
。根据定义,这使得任何东西都会崩溃到0的高度。
我怀疑你在旧网格上做的样式是造成主要问题的原因。
答案 1 :(得分:3)
这就是twitter bootstrap所说的:
行必须放在.container(固定宽度)或.container-fluid(全宽)内,以便正确对齐和填充。
嗯,这大约是container
而不是rows
,但是如果这个解释对你来说还不够,那么this is这个简短的解释应该会让你明白。
注意:如果版本为2,那么row-fluid
本身就是float: left
,需要按照您的说法清除。
这是因为Fluid网格使用不同的嵌套:每个嵌套级别的列最多可以添加12列。这是因为流体网格使用百分比而不是像素来设置宽度。
希望这会有所帮助:)
答案 2 :(得分:2)
Bootstrap 2.x到3.0类更改 Bootstrap 2.x - > .row-fluid 和Bootstrap 3.0 - > .row