CODEWITHSUNDEEP
htmlcssradio-button
kleaver
kleaver

Reputation: 841

Radio buttons and text orientation

How can I move the text of a radio button closer to the button itself? When I create a radio button, the button text appears about 10px away from the button, making the horizontal orientation awkward because the text then begins to overlap onto the button to the right.

How can I change the distance of the text from the button?

Upvotes: 0

Views: 1153

Answers (2)

spicykimchi
spicykimchi

Reputation: 1151

Put a span tag on the text of the input button. and adjust its selectors padding or margin. Some text

Upvotes: 0

Jarrett Widman
Jarrett Widman

Reputation: 6429

Note in the below style="margin:0;"

<input type="radio" style="margin:0;" value="radio" id="radio" name="radio" />Some Text

If you want to do this with a class I'd recommend wrapping the radio buttons because type selectors don't work in all browsers:

    <style type="text/css">
      .nomarginradio input{ margin:0; }
    </style>
    <div class="nomarginradio">
      <input type="radio" value="radio" id="radio" name="radio" />Some Text
    </div>

Upvotes: 2

Related Questions