bootstrap how radiobox align with label

Question

the problem i face is like the following image: enter image description here it is weird that label and radiobox are not "in same line", and my code is:

<div class="form-group">
<label class="col-sm-3 control-label"><small><span class="text-danger glyphicon glyphicon-asterisk" aria-hidden="true"></span></small>飲食</label>
<div class="col-sm-8">
<div class="input-group">
<label><input type="radio" name="food" value="1" id="food" checked> 葷　</label>
<label><input type="radio" name="food" value="2" id="food"> 素　</label>
<label><input type="radio" name="food" value="3" id="food"> 不需要</label>
</div>
</div>
</div>

http://stackoverflow.com/questions/13509883/how-to-vertically-align-a-html-radio-button-to-its-label — trainoasis, May 05 '15 at 08:35

score 1 · Answer 1 · answered May 05 '15 at 08:57

1

Try to add the 'radio inline' class to the control label, it should line up correctly with the other labels.

Try this:

    <label class="radio inline control-label">Some label</label>

answered May 05 '15 at 08:57

Elle

63
2
10

hmm. just use class and call it in CSS, then use vertical-align: text. – Elle May 05 '15 at 10:12

bootstrap how radiobox align with label

1 Answers1