我有一个带有内置无线电组的Bootstrap标记:

<div class="container">
    <section id="content">

        <form class="form-horizontal" role="form" name="myForm">
            <div class="panel panel-default">

                <div class="panel-heading">
                    <h3 class="panel-title">Panel title</h3>
                </div>

                <div class="panel-body">

                    <div class="form-group">
                        <div class="col-sm-6 col-sm-offset-3">
                            <label for="myField" class="control-label">Radio title:</label>

                            <label class="radio-inline">
                                <input type="radio" name="myField" value="normal" /> RADIO1
                            </label>

                            <label class="radio-inline">
                                <input type="radio" name="myField" value="high" /> RADIO2
                            </label>
                        </div>
                    </div>

                </div>
            </div>
        </form>

    </section>
</div>


看起来像这样:



如何使标题和广播输入水平对齐?

请参阅此JSFiddle:http://jsfiddle.net/dennismadsen/u6qus4ud/1/

最佳答案

在标签中添加vertical-align:middle;vertical-align:top;

label {
vertical-align: middle;
}


检查Fiddle

09-20 16:29