Question

我正在创建一个网页，并希望使用类似于带有已定义列和行的基础/引导程序的系统。我对目前的情况感到满意，但是我不知道如何在一行中居中，同时仍然使用已定义的网格系统。我知道通常html的格式如下：

 <div class="column column-6 center">

http://codepen.io/Kiwimoose/pen/dpvEqO

到目前为止我有什么，我只是不确定＆＃34;中心＆＃34;标签通常在基础中格式化。我希望第二行中的列以及将来的其他列。

Answer 1

您的代码没问题，您只需更改CSS中的顺序：

.column {
    position: relative;
    float: left;
    display: block;
}

.center {
    margin:auto;
    float:none;
}

样式.center类之后。列类，它将工作。顺便说一句，最好清理一下你的代码。

Answer 2

尝试

<div align="center">

然后你可以在你正在做的css中自定义它

Answer 3

在Zurb基金会，你可以使用“ -offset - ”和“end”类名，例如

{
  "id_": 1,
  "name": "Papa",
  "parents": [
    {
      "@class": "com.doubleip.spot.mgmt.test.domain.model.Parent",
      "id_": 1,
      "name": "Dad",
      "children": [
        {
          "@class": "com.doubleip.spot.mgmt.test.domain.model.Child",
          "id_": 1,
          "name": "Bob"
        },
        {
          "@class": "com.doubleip.spot.mgmt.test.domain.model.Child",
          "id_": 2,
          "name": "Trudy"
        }
      ]
    },
    {
      "@class": "com.doubleip.spot.mgmt.test.domain.model.Parent",
      "id_": 2,
      "name": "Mom",
      "children": [
        1,
        2
      ]
    }
  ]
}

docs here

Answer 4

使用Twitter Bootstrap正确居中（没有头痛）你可以简单地设置空div，如下所示：

<div class="row">
    <div class="col-xs-3"></div>
    <div class="col-xs-6">
       centered div in all resolutions
    </div>
    <div class="col-xs-3"></div>
</div>

或者你也可以使用偏移

在有组织的列系统中居中一个div

4 个答案: