如何将CSS居中一个div，这是一个表单元素的子节点？

Question

我不确定我做错了什么，但我一直在努力将这个div放在中心位置：

<form>
    <div class="submitter">
        <div data-role="controlgroup" data-type="horizontal">
            <input type="submit" value="submit" data-theme="e" />
            <input type="reset" value="reset" />
        </div>
    </div>
</form>

表单中有更多内容，但我只是对控制组居中感兴趣。

我已经尝试了从text-align到margin: 0 auto所知道的一切，但我无法让它发挥作用。在我的解压缩中，我为表单设置了一个修复宽度并添加了submitter元素，我将其扩展为100%，然后将控制组设置为display:inline-block，但我无法使其工作。 ..

问题：
如何将控制组放在表单的中心？

谢谢！

修改
这是我的表格

这两列都是ul个元素，width:49%;display:inline;

Answer 1

保证金：0自动;对我有用（你应该在使用margin之前设置你的块的宽度：0 auto;）

CSS：

<style>
.one {
border:1px solid;
width:300px;
margin:0 auto;
}
</style>

HTML：

<form>
    <div class="submitter">
        <div data-role="controlgroup" data-type="horizontal" class="one">
            <input type="submit" value="submit" data-theme="e" />
            <input type="reset" value="reset" />
        </div>
    </div>
</form>

Answer 2

http://jsfiddle.net/Kyle_Sevenoaks/fNYb4/

使用属性选择器在内部div上使用margin: 0 auto;似乎有效。

div[data-role="controlgroup"]
{
    width: 50%;
    margin: 0 auto;
}

请记住，父元素需要设置宽度以及要居中的元素。

Answer 3

我认为你应该首先定位父div ...

这是jsFiddle上的Solution