css3 - CSS label lose margin/padding -
i'm unable lose padding and/or margin between 2 of radiobutton's labels.
this have far: http://jsbin.com/putoz/6/edit
what i've tried far:
- forcing width of outer div
- forcing margin-rigth/left , padding-right/left 0px on both labels
easiest way make labels block elements , float them:
label { width: 32px; height: 29px; cursor: pointer; position: relative; display: block; float: left; line-height: 29px; }
you'll need adjust line height keep text in vertical centre.
or, if that's impractical, remove white space markup:
this:
<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>
becomes:
<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>
Comments
Post a Comment