控制单选按钮对齐

时间:2017-03-07 10:45:49

标签: html css

我使用框架Boostrap,我想控制单选按钮对齐。

我看到的所有显示单选按钮的响应列表的示例都不管理对齐。他们要么使用相同尺寸或​​固定宽度的标签来保持对齐,但没有真正的响应。

我尝试使用下面的解决方案但是

http://jsfiddle.net/rm7n73ep/`

<label class="radio-inline">
<input type="radio" name="inlineRadioOptions" id="inlineRadio2" value="option2">
Radio button's label 2

有人知道如何将响应行为的属性与标签和单选按钮的正确对齐结合起来吗?

非常感谢您的回答!

2 个答案:

答案 0 :(得分:0)

添加以下class

label{
            display: block;
        }

答案 1 :(得分:0)

检查这是否有帮助:

                <div class="form-group">
                    <label class="col-md-5"> Your label </label>
                    <div class="col-md-7">
                        <div class="col-md-6">
                            <input type="radio" name="name1" value="0" checked/>
                            <label for="name1">Input 1</label>

                            <input type="radio" name="name2" value="1" />
                            <label for="name2">Input2</label>
                        </div>

                    </div>
                </div>