Question

我正在使用Twitter Bootstrap，我正在尝试使用三个span3 div的居中行创建一个网格。

我试图通过将三个span3包装在居中的span9中来实现这一点，但这似乎不起作用。

我的问题是div没有正确居中，因为我是HTML和CSS的新手，我真的需要一些帮助。谢谢！

HTML

<div class="row">
   <div class="span9 center">
       <div class="span3">
          <p>THUMBNAIL1</p>
       </div> 
       <div class="span3">
          <p>THUMBNAIL2</p>
       </div>     
       <div class="span3">
          <p>THUMBNAIL3</p>
       </div> 
    </div>
</div>

等。

CSS：

.center {
     float: none;
     margin-left: auto;
     margin-right: auto;
     align: center;
}

Answer 1

而不是使用：

align: center;

使用：

text-align: center;

align不是css规则，但我猜你是从align的语法中获得它作为标签上的属性

你也可以把它们放在里面，元素与位置相对，然后在里面用它们：

position: absolute;
left: 50%;
transform: (0, 50%);

您也可以使用：

.span3 {
    display: inline-block;
    clear: both;
}
.span9 {
    text-align: center;
}

Fiddle Demo

如何居中三跨3

1 个答案: