twitter-bootstrap 一行两个 div(使用 col-md 和 col-md-offset Bootstrap)
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/27448742/
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
Two div's in one line(using col-md and col-md-offset Bootstrap)
提问by Andrew
I'm having two divs:
我有两个 div:
<div class="col-md-6 col-md-offset-1 "> </div>
<div class = "col-md-3 col-md-offset-9 "></div>
It looks like this:
它看起来像这样:
But I need it to look like this:
但我需要它看起来像这样:
<div class="col-md-6"> </div>
<div class = "col-md-3"> </div>


But I need to use offset.
但我需要使用偏移量。
回答by Yousof K.
The count of columns in an entire row is always 12.
整行中的列数始终为 12。
So, in your first code, you're reaching 19 columns therefore this is happening, you need to sum them up to 12.
因此,在您的第一个代码中,您将达到 19 列,因此正在发生这种情况,您需要将它们加起来为 12。
section 1: offset 1 + width 6 = 7 then section 2: offset 2 + width 3 = 5
第 1 部分:偏移 1 + 宽度 6 = 7 然后第 2 部分:偏移 2 + 宽度 3 = 5
Total: 12
总数:12
This should work.
这应该有效。
<div class="col-md-6 col-md-offset-1 "> </div>
<div class = "col-md-3 col-md-offset-2 "></div>
or anything that adds up to 12.
或任何加起来为 12 的东西。
回答by Simone
What are you exactly trying to do? If you want it to look like the second image you can use:
你到底想做什么?如果您希望它看起来像第二张图片,您可以使用:
<div class="col-md-9"> </div>
<div class="col-md-3"> </div>
Or if you want an offset of, say, 3 columns between them, maybe you want something like:
或者,如果您想要它们之间的偏移量,例如 3 列,也许您想要以下内容:
<div class="col-md-6 col-md-offset-3"> </div>
<div class="col-md-3"> </div>
If you want less offset, say two columns, increase the size of the first column accordingly, e.g.:
如果你想要更少的偏移量,比如两列,相应地增加第一列的大小,例如:
<div class="col-md-7 col-md-offset-2"> </div>
<div class="col-md-3"> </div>
回答by TheLogicGuy
To show 2 Div's one on the far right and the other on the far left:
要在最右侧显示 2 Div 的一个,在最左侧显示另一个:
CSS:
CSS:
.div1,.div2 {
display: inline-block;
}
Inside Body tag:
身体内部标签:
<div class="div1">Div 1 content</div>
<div class="div2 pull-right">Div 2 content</div>
Notice the pull-rightbootstrap's class. Alternatively you can use float:right.
注意pull-right引导程序的类。或者,您可以使用float:right.
回答by sanjith edward
It should be something like this.
它应该是这样的。
class="col-md-6 col-md-offset-1"
class="col-md-3 col-md-offset-2"

