CSS标签丢失边距/填充

Question

我无法在我的两个radiobutton标签之间丢失填充和/或边距。

这是我到目前为止所做的：http://jsbin.com/putoz/6/edit

到目前为止我尝试过：

• 强制外部div的宽度
• 在两个标签上强制margin-rigth / left和padding-right / left为0px

Answer 1

最简单的方法是使标签块元素并浮动它们：

DEMO

label {  
    width: 32px;
    height: 29px;
    cursor: pointer;  
    position: relative;  

    display: block;
    float: left;
    line-height: 29px;
}

您需要调整线条高度以使文字保持垂直居中。

---

或者，如果这不切实际，只需从标记中删除空格：

：此：

<input id="appointment-yes" type="radio" name="set-appointment" value="yes" />
<label class="yes-label" for="appointment-yes"></label>
<input id="appoinment-no" type="radio" name="set-appointment" value="no" />
<label class="no-label" for="appoinment-no"></label>

<强>变为：

<input id="appointment-yes" type="radio" name="set-appointment" value="yes" /><label class="yes-label" for="appointment-yes"></label><input id="appoinment-no" type="radio" name="set-appointment" value="no" /><label class="no-label" for="appoinment-no"></label>

DEMO