Html 单选按钮对齐问题

如何使单选按钮更靠近标签

input[type="radio"]{
   float: left;
   width: auto;
   margin-left: 3em;
}

<fieldset id="payment_method">
<legend>Payment Method</legend>
<input type="radio" name="payment_method"value="Bill Me">
<label for= "payment1"> Bill Me</label>
<input type="radio" name="payment_method"value="Bill Me">
<label for= "payment2">Credit Card</label>
</fieldset>

input[type=“radio”]{
浮动：左；
宽度：自动；
左边距：3em；
}
付款方式
给我开账单
信用卡

您不需要浮动输入，只需给标签一个负边距即可，如下所示：

label {
margin-left: -1px;
}

---

只是不要对你的无线电输入应用任何规则。由于所有表单元素都是非块级元素（不包括

表单

本身），因此您不需要

浮动它们（在您的情况下）并删除额外的
边距
。见

我喜欢将输入/标签对包装在
中，以简化样式设置。之后，您可以删除标签和输入标记之间的换行符：

<fieldset id="payment_method">
  <legend>Payment Method</legend>
  <div class="fieldgroup">
    <input type="radio" name="payment_method"value="Bill Me"><label for= "payment1">Bill Me</label>
  </div><!--/.fieldgroup-->
  <div class="fieldgroup">
    <input type="radio" name="payment_method"value="Bill Me"><label for= "payment2">Credit Card</label>
  </div><!--/.fieldgroup-->
</fieldset>

对不起，我看到小提琴了，但我不明白。如果输入[type=“radio”]中没有样式，它们将再次垂直对齐。
<fieldset id="payment_method">
  <legend>Payment Method</legend>
  <div class="fieldgroup">
    <input type="radio" name="payment_method"value="Bill Me"><label for= "payment1">Bill Me</label>
  </div><!--/.fieldgroup-->
  <div class="fieldgroup">
    <input type="radio" name="payment_method"value="Bill Me"><label for= "payment2">Credit Card</label>
  </div><!--/.fieldgroup-->
</fieldset>

input[type='radio'],
label {
  float: left;
}
.fieldgroup:after {
  content: "";
  display: block;
  clear: both;
}