如何使用Bootstrap2来定位div？ [英] How to center a div with Bootstrap2?

问题描述

http://twitter.github.com/bootstrap/scaffolding.html

我试过像所有的组合：

 < div class =row> 
< div class =span7 offset5>框< / div> 
< / div> 
  

或

 < div class =container> 
< div class =row> 
< div class =span7 offset5>框< / div> 
< / div> 
< / div> 
  

更改了跨度和偏移量...

但是我不能得到一个完全集中在一个页面上的简单框：（

我只想要一个6列宽的框居中...

---

编辑：

使用

 < div class =container> 
< div class =rowid =login-container> 
< div class =span8 offset2> 
 box 
< / div> 
< / div> 
< / div> 
  
 
 
 
但是盒子太宽了，我能用span7做什么吗？
 
 
 
  span7 offset2 向左添加一个填充 span7 offset3 向右添加一个填充... 
解决方案
除了缩小div本身到你想要的大小，通过减少span的大小，所以...  class =span6 offset3， class =span4 offset4，等等...  style =text-align ：center可能会产生您要查找的效果
 
 
 
您不能使用带有任何偏移量的span7， （因为总跨度= 12）
 
http://twitter.github.com/bootstrap/scaffolding.html

I tried like all combinations:
<div class="row">
  <div class="span7 offset5"> box </div>
</div>
or 
<div class="container">
  <div class="row">
    <div class="span7 offset5"> box </div>
  </div>  
</div>
changed span and offset numbers...

But I cant get a simple box perfectly centered on a page :(

I just want a 6-column-wide box centered...


edit:


did it with 
<div class="container">
  <div class="row" id="login-container">
    <div class="span8 offset2">
       box
    </div>
  </div>
</div>
But the box is too wide, is there any way I can do it with span7 ?

span7 offset2 gives extra padding to the left span7 offset3 extra padding to the right...
解决方案
besides shrinking the div itself to the size you want, by reducing span size like so... class="span6 offset3", class="span4 offset4", etc... something as simple as style="text-align: center" on the div could have the effect you're looking for

you can't use span7 with any set offset and get the span centered on the page (Because total spans = 12)

                        
这篇关于如何使用Bootstrap2来定位div？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！