[解決済み] 入力のラジオ要素を水平に揃えるにはどうしたらいいですか？

質問

これらのラジオ入力を、1つの下にではなく、画面全体に伸ばしたいのですが。

HTML

<input type="radio" name="editList" value="always">Always
<br>
<input type="radio" name="editList" value="never">Never
<br>
<input type="radio" name="editList" value="costChange">Cost Change

CSS

input[type="radio"] {
    margin-left:10px;
}

http://jsfiddle.net/clayshannon/8wRT3/13/

ディスプレイのプロパティをいじったり、ググったり、答えを求めてバン(bung? binged?)したりしましたが、見つかりません。

解決するには？

あなたの場合、改行を削除するだけです( <br> タグ) の間にある input 要素は inline-block は、デフォルトでは（少なくともChromeでは）。 (更新例) .

<input type="radio" name="editList" value="always">Always
<input type="radio" name="editList" value="never">Never
<input type="radio" name="editList" value="costChange">Cost Change

を使うことをお勧めします。 <label> 要素もありますが。そうすることで、ラベルをクリックすると、その要素もチェックされる。のどちらかを関連付けます。 <label> 's for 属性に <input> 's id : (例)

<input type="radio" name="editList" id="always" value="always"/>
<label for="always">Always</label>

<input type="radio" name="editList" id="never" value="never"/>
<label for="never">Never</label>

<input type="radio" name="editList" id="change" value="costChange"/>
<label for="change">Cost Change</label>

...または <label> 要素の周りに <input> 要素を直接指定します。 (例)

<label>
    <input type="radio" name="editList" value="always"/>Always
</label>
<label>
    <input type="radio" name="editList" value="never"/>Never
</label>
<label>
    <input type="radio" name="editList" value="costChange"/>Cost Change
</label>

また、もっと派手にして :checked 擬似クラス .