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

背景：我有一个从flask模板中呈现的HTML表单，该模板包含5行按钮，所有按钮都是images。每个<div>按钮都会自动开始新的一行按钮，每一行都与页面左侧对齐。

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>

注意：我正在尝试使用以下CSS代码将每行（行数在按钮数量上有所不同）水平居中：

CSS代码：

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

div {
margin: 0 auto;
}

但是，以这种方式告诉CSS将每行居中是行不通的（每行从左侧开始），也没有应用margin: 0 auto;到input我尝试创建的CSS选择器或任何CSS选择器。表单或烧瓶渲染模板时是否存在隐藏的并发症？还是我只是缺少适当的位置来定义margin属性？