将单选按钮垂直放置在同一位置

时间:2015-03-28 15:40:05

标签: html css forms radio-button

我正在尝试将单选按钮垂直放置在同一位置,而左侧有一个标签。这是我期望的结果:

http://oi58.tinypic.com/dnk8yh.jpg

我将第二个单选按钮定位到与第一个单选按钮相同的位置时遇到问题。

1 个答案:

答案 0 :(得分:1)

喜欢这个吗?

要将标签对齐到相对于单选按钮组的顶部,请使用此标签上的vertical-align:top并将单选按钮放在某个div中;不要忘记它inline-block,否则标签和按钮将保持不同的行:



#radio-group{
    display:inline-block
}
#label{
    vertical-align:top;
}

<span id="label">label</span> 
<div id="radio-group">
    <input type="radio" name="rg">radio1<br>
    <input type="radio" name="rg">radio2
</div>
&#13;
&#13;
&#13;