Name:
Clever Geek Handbook

CSS: how to make a shortcut to the right of the radio?

Let's say I have the following inscription:

<label for="name">Name:</label>
<input type="radio" name="name" id="name"/>

The order of the tags seems correct to me (in a semantic sense: the label is in front of what you are labeling). But first I want to display this as a radio button and then a shortcut. How do I do this in CSS?

+3


source to share


6 answers


You don't need CSS. Wrap your input in a label and put the text last.

<label><input type="radio" name="name" id="name"/>Name:</label>


Is this still semantic to you?

Or you can try a float.

+6


source


In this case, the order of the tags does not matter. And even if that were the case, then it would be the other way around: first you would need to create a radio button and then reference it in the label.

To answer your question: just do it in the order you want to display it



<input type="radio" name="name" id="name"/>
<label for="name">Name:</label>

fiddle http://jsfiddle.net/Jm2JR/1/ ..

+2


source


write like this:

input{
 float:left;
}

Check it out http://jsfiddle.net/3cLRg/

+1


source


try this:

<label style="position:relative; left:100px;" for="name">Name:</label>
<input type="radio" name="name" id="name"/>

Second approach:

<input type="radio" name="name" id="name"/>
<label for="name">Name:</label>
+1


source


Hi you just define your input tag as such

<label>Name:
<input type="radio" name="name" id="name"/></label>

<br />


<label>
<input type="radio" name="name" id="name"/> Name    
</label>
​

Live demo http://jsfiddle.net/rohitazad/bhBQn/1/

+1


source 


<label for="name" style="float:right;">Name:</label>

0


source






More articles:


All Articles