twitter-bootstrap Bootstrap 固定大小列
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/17941263/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Bootstrap fixed size column
提问by korvinko
I need to do fixed width right column column in bootstrap, but left column will be responsive.
我需要在引导程序中做固定宽度的右列，但左列会响应。
I use bootstrap 2.3.2
我使用引导程序 2.3.2
(source: toile-libre.org)
（来源：toile-libre.org）
Right column will not be resized at all screen size.
右栏不会在所有屏幕尺寸下调整大小。
采纳答案by Ian Clark
My basic solution below (see it in action here). I've padded out the CSS to demonstrate the blocks with colours, but all you really need to do is as follows:
我在下面的基本解决方案（在此处查看实际操作）。我已经填充了 CSS 来演示带有颜色的块，但您真正需要做的如下：
Fixed element
固定元件
- Set it to
float:right - Apply a fixed width to it
- 将其设置为
float:right - 对其应用固定宽度
Fluid row element
流体行元素
- Apply
padding/margin-rightequal to the width of the fixed element - Apply
box-sizing:border-box, so that the 100% width against the.row-fluidelement persists, but the margin/padding added doesn't push it out further. The markup below shows the minimum you'll need.
- 应用
padding/margin-right等于固定元素的宽度 - Apply
box-sizing:border-box，以便.row-fluid元素的 100% 宽度保持不变，但添加的边距/填充不会将其进一步推出。下面的标记显示了您需要的最低限度。
CSS
CSS
#fixed-width {
width:100px;
float:right;
}
#fluid.row-fluid {
margin-right:100px;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
}
HTML
HTML
<div class="clearfix">
<div id="fixed-width">Content...</div>
<div id="fluid" class="row-fluid">
<div class="span4">a</div>
<div class="span4">b</div>
<div class="span4">c</div>
</div>
</div>
回答by PA.
this kind of design it's not provided by bootstrap, but there are simple solutions.
bootstrap 不提供这种设计，但有简单的解决方案。
Here is one, see the accepted answer to this previous SO question Bootstrap: Fixed gutter width in fluid layout?
这是一个，请参阅上一个 SO 问题Bootstrap: Fixed gutter width in fluid layout?的已接受答案。
and in particular, this css tricks
尤其是这个 css 技巧
.fluid-fixed {
margin-right: 240px;
margin-left:auto !important;
}
as shown in this fiddle http://jsfiddle.net/6vPqA/808/
如这个小提琴所示http://jsfiddle.net/6vPqA/808/
