将HTML表单中的图像按钮行居中

背景：我有一个HTML表单，它是从烧瓶中的模板中呈现出来的，其中包含5行按钮，所有按钮都是图像。每个

自动开始一行新按钮，每行与页面左侧对齐

HTML代码：

<form action="/select" method="POST">
 <div>
  <input type=image/>
  <input type=image/>
 </div>
 <div>
  <input type=image/>
  <input type=image/>
  <input type=image/>
 </div>
</form>

input {
height: 100px;
width: 100px;
border-radius: 10px;
}

div {
margin: 0 auto;
}

---

但是，告诉CSS以这种方式居中每一行是不起作用的（每一行从左侧开始），也没有应用

margin:0自动

到

输入

或我尝试创建的任何CSS选择器。呈现模板的表单或烧瓶是否存在隐藏的复杂性？或者我只是缺少定义边距属性的正确位置？

您是否尝试过这样做

<input type="image" src="submit.gif" align="right"  width="48" height="48">

---

您可以通过在输入元素中使用align标记将图像设置为居中对齐。

将div中的text align:center设置为水平居中元素：

div {
    text-align: center;
}

---

这解决了问题。因此，这是

margin:auto

的正确替代品，因为页面上的图像/按钮是内联元素，对吗？@J.ThomasShorty是的，

text align

有效，因为按钮是内联元素

margin:auto

在此失败，因为它还需要在div上明确指定宽度。