动态中心对齐div中的按钮？

Question

我有一个div,根据不同的场景可以有2个或4个按钮.我希望div内的按钮居中对齐.如何做到这一点.我在下面提交了我的代码.

<div style="margin: 0 auto; width: 656px;">
    <input type="submit" style="float:left;"  value="Prev"/><input type="reset"  value="Reset" style="float:left;"/>
   <input type="submit"  value="Submit" style="float:left;"/><input style="float:left;" type="submit"  value="Close"/></div>

问题是它显示四个按钮时有效,但不适用于3,2和1按钮情况.如何在不指定宽度的情况下居中对齐？Plz的帮助.

Answer 1

您需要text-align: center在容器元素上使用.另外,避免使用内联样式......

<div style="margin: 0 auto; width: 656px; text-align: center;">

演示

注意:text-align: left;如果您在其他内部有任何文本,请确保使用div它们也将居中.

正如你评论的那样,它看起来像是我的中心

仍然你不相信他们完全居中,我会调整容器width,并告诉你他们在中心....

有2个按钮

注意:确保您也使用CSS重置...因此,您可以在所有浏览器中获得一致的样式,但无论重置样式如何都应该居中.