html - 带有CSS的中心输入框

Question

我有以下内容:

如何让输入框在两个 span 之间居中？

<div style="margin: 10% auto 0px; width: 80%;">
   <span style="float: left;">Number of Todos:</span>
   <input type="text" placeholder="input todo" style="text-align: center;">
   <span style="float: right;">Number Checked</span>
</div>

Answer 1

只需添加文本对齐到主 div。它会起作用

<div style="margin: 10% auto 0px; width: 80%; text-align:center;">
   <span style="float: left;">Number of Todos:</span>
   <input type="text" placeholder="input todo" style="text-align: left;">
   <span style="float: right;">Number Checked</span>
</div>