水平CSS对齐

Question

有人可以解释我如何让我的按钮位于红色区域的中心，无论按钮的宽度如何？

这里是我的演示： http://jsfiddle.net/v3X2k/

这里是我的代码：

<div style="width:660px;height:40px;display;block;background:red"> 

    <div id="wrapper3" style="margin:0 auto;width:160px"> 

     <button>Test</button> 
     <button>Test 2</button> 

    </div> 

</div> 

<hr /> 

<div style="width:660px;height:40px;display;block;background:red"> 

    <div id="wrapper3" style="margin:0 auto;width:160px"> 

     <button>Test Test Test Test Test Test</button> 
     <button>Test 2</button> 

    </div> 

</div> 

您可以在第二个例子看，第二个按钮低于，而实际上我想他们保持内联，就像上面的那样。

我很高兴放弃width:160px声明，但只需要对齐这些按钮集中。

任何想法？

非常感谢:)

Answer 1

你不必使用固定宽度和保证金自动包装格...只是div容器

Demo

Answer 2

text-align: center; 

按钮使用text-align: center;是内联元素，所以这将工作。

jsFiddle

Answer 3

有人称它为不好的做法，我想你必须要小心，但你可以使用：
<center></center>

（在角落隐藏）不要向下投我遗忘对于我的建议。