Jquery Mobile：用于验证HTML5的样式网格

Question

在我的网站上，我正在使用Jquery mobile，我需要使用网格来对齐每个单元格中心的按钮：

|   [BUTTON]   |   [BUTTON]   |   [BUTTON]   |

我的代码是

<div class="ui-grid-c" align="center">
    <div class="ui-block-a">
       [button code]
    </div>
    <div class="ui-block-b">
       [button code]
    </div>
    <div class="ui-block-c">
       [button code]
    </div>
</div>

但如果我使用align中的div属性，我会收到HTML5验证错误。

所以我的问题是，我如何设置样式以获得图形结果？

Answer 1

我不确定您是希望它们彼此对齐还是彼此重叠（但在中间），但是将text-align:center;添加到ui-grid-c div应该应用于div在下面并强制按钮（<input>或<button>）居中，因为它们是内联元素。

Here's一个JSFiddle示例。

修改
另外，如果你想要它们，你需要float内部div并为它们指定宽度（如果你只有三个，33%应该是好的）。看看我的例子。

这是代码：

.ui-grid-c {
    text-align:center; 
}
.ui-grid-c > div {
    width:33%;  /*Remove this if you don't want them in a line*/ 
    float:left; /*Remove this if you don't want them in a line*/
}

Answer 2

<div style="margin:0 auto;">
----Conent------
</div>

这会在div的两边都设置边距。