我想将单选按钮置于行内 block 的中央。我有一个 fiddle ,可以向您展示我现在拥有的东西以及我想要它的外观。
https://jsfiddle.net/ut522fca/
代码目前看起来像这样:
<span style="width: 45px; height: 45px; margin:auto; display: inline-block; vertical-align: middle; border-radius: 2px; background: #006884"><input type="radio" name="Color" id="radio" value="006884"></span>
最佳答案
<span style="width: 45px; height: 45px; line-height: 45px; text-align: center; margin:auto; display: inline-block; vertical-align: middle; border-radius: 2px; background: #006884"><input type="radio" name="Color" id="radio" value="006884"></span>
<span style="width: 45px; height: 45px; line-height:45px; text-align:center; margin:auto; display: inline-block; vertical-align: middle; border-radius: 2px; background: #006884"><input type="radio" name="Color" id="radio" value="006884"></span>
<span style="width: 45px; height: 45px; line-height:45px; text-align:center; margin:auto; display: inline-block; vertical-align: middle; border-radius: 2px; background: #00909E"><input type="radio" name="Color" id="radio" value="00909E"></span>
<span style="width: 45px; height: 45px; line-height:45px; text-align:center; margin:auto; display: inline-block; vertical-align: middle; border-radius: 2px; background: #89DBEC"><input type="radio" name="Color" id="radio" value="89DBEC"></span>
<br>
<br>
<p>I would like it to look like the boxes below with the radio button in the center without using a table.</p>
<table cellpadding="10">
<tr>
<td bgcolor="#006884"><input type="radio" name="Color" id="radio" value="006884"></td>
<td bgcolor="#00909E"><input type="radio" name="Color" id="radio2" value="00909E"></td>
<td bgcolor="#89DBEC"><input type="radio" name="Color" id="radio3" value="89DBEC"></td>
</tr>
</table>
关于html - 需要将单选按钮置于内联 block 的中央,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33490106/