user5237344
user5237344

Reputation: 11

How do I change the position of a radio button in html?

I am programming a webpage that uses a series of radio buttons and drop down menus to change the data that is displayed on the screen. Each radio corresponds to one of the drop down menus and I want to line them up but I can't figure out how to get the third one to appear to the right of the other two instead of below them. Can anyone help?

Here's my code:

<form action="" style="float: left">
<input type="radio" name="yearLessGreaterOption" value="<" onchange="setYearLessGreaterFilter(this.value)"><
<input type="radio" name="yearLessGreaterOption" value="=" onchange="setYearLessGreaterFilter(this.value)" checked>=
<input type="radio" name="yearLessGreaterOption" value=">" onchange="setYearLessGreaterFilter(this.value)">>
</form>

<form action="">
<input type="radio" name="roundLessGreaterOption" value="<" onchange="setRoundLessGreaterFilter(this.value)"><
<input type="radio" name="roundLessGreaterOption" value="=" onchange="setRoundLessGreaterFilter(this.value)" checked>=
<input type="radio" name="roundLessGreaterOption" value=">" onchange="setRoundLessGreaterFilter(this.value)">>
</form>

<form action="">
<input type="radio" name="goalsH1LessGreaterOption" value="<" onchange="setGoalsH1LessGreaterFilter(this.value)"><
<input type="radio" name="goalsH1LessGreaterOption" value="=" onchange="setGoalsH1LessGreaterFilter(this.value)" checked>=
<input type="radio" name="goalsH1LessGreaterOption" value=">" onchange="setGoalsH1LessGreaterFilter(this.value)">>
</form>

Here's a picture of the page in question:

Upvotes: 0

Views: 1690

Answers (2)

Ichigo
Ichigo

Reputation: 109

Is there a reason you want them in form tags? If you remove the tags, they will appear aligned. Otherwise, adding style="float:left;" to the other form tags will do the trick.

Upvotes: 2

Julien P.
Julien P.

Reputation: 35

In your case, adding the style="float: left" on the other forms should do what you want.

Upvotes: 1

Related Questions