html - 将三个 div 居中对齐

Question

我在 bootstrap-fluid layout 中遵循了布局

<div class="container">
   <div class="row-fluid">
     <div class="span3 offset1"> </div>
     <div class="span3"> </div>
     <div class="span3"> </div>
   </div>
</div>

我的问题是我想将所有三个跨度完全居中对齐因为我正在使用流体布局...在全屏中，上面的布局完全居中对齐，因为我为第一个 div 应用了固定偏移

但是随着宽度变小。上述所有 3 个 div 都没有在中心完全对齐，因为偏移量是固定的。

我认为，这就是正在发生的事情......在引导程序中，我们有 12 个列，所有列占据 9 个跨度......剩余的是 3 个跨度（奇数），因为奇数我无法在两边留下偶数跨度。 ……

有什么解决办法吗？......

Answer 1

里面应该有一排。

<div class="container">
    <div class="row-fluid">
       <div class="span3 offset1"> </div>
       <div class="span3"> </div>
       <div class="span3"> </div>
    </div>
</div>

解决此问题的非引导方法：

<div class="container">
    <div style="width: 80%; margin: 0 auto;">
        <div class="row-fluid">
            <div class="span3 offset1"> </div>
            <div class="span3"> </div>
            <div class="span3"> </div>
        </div>
    </div>
</div>

新元素的宽度可以是最大宽度，也可以是静态宽度。

Answer 2

Bootstrap 的跨度向左浮动。您可以使用以下方法覆盖此行为：

<div class="container">
<div class="span9" style="float: none; margin-left: auto; margin-right: auto"> 
    <div class="row-fluid">
        <div class="span4">... </div>
        <div class="span4">... </div>
        <div class="span4">... </div>
    </div>
</div>
</div>

Answer 3

像这样

<div class="row-fluid">
     <div class="span3 offset1"> </div>
     <div class="span3"> </div>
     <div class="span3"> </div>
</div>


<div class="container">

代替 ：

<div class="row-fluid">

我想点击下面的链接重复问题

是否可以水平居中对齐一行不等于 12 的引导跨度？