I have the following HTML:
You can add this to your stylesheet:
input[type="radio"] {
margin-right: 10px;
}
Many HTML elements have a default margin setting. You can override this and set it to 0. In your case, you want to reset margin-right
on the radio button:
<input type="radio" name="beds" value="1" style="margin-right: 0" />1+
You probably want to add it to your stylesheet so that it applies to all radio buttons:
input[type="radio"] {
margin-right: 0;
}
You'll need the label
element.
<input type="radio" name="beds" value="1" id="first" /><label for="first">1+</label>
<input type="radio" name="beds" value="2" id="second" /><label for="second">2+</label>
You can then style this like this:
label {
margin-left: -3px;
}
Also note the use of the for
attribute for accessibility purposes.