twitter-bootstrap 如何使用 Bootstrap 并排放置两个选择?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/25228284/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to place two selects side by side using Bootstrap?
提问by Xubayer pantho
I want to place two select options side by side in my form. I am using Bootstrap 3 but I can't place them with proper alignment.
我想在表单中并排放置两个选择选项。我正在使用 Bootstrap 3,但我无法正确对齐它们。
Here is my HTML code:
这是我的 HTML 代码:
<form role="form">
<div class="form-group">
<div class="input-group date" id="datetimepicker1">
<input type="text" class="form-control"/>
<span class="input-group-addon"><span class="fa fa-calendar"></span></span>
</div>
</div>
<div class="form-group">
<div class="input-group">
<input type="text" class="form-control"/>
<span class="input-group-addon"><span class="fa fa-calendar"></span></span>
</div>
</div>
<div class="form-group">
<select class="form-control">
<option>1</option>
<option>2</option>
<option>3</option>
</select>
</div>
<div class="form-group">
<select class="form-control">
<option>1</option>
<option>2</option>
<option>3</option>
</select>
</div>
<button type="submit" class="btn btn-primary btn-block te" >Prices & Availability</button>
</form>
回答by Harsh
Use this
用这个
jsfiddle http://jsfiddle.net/harshdand/e0fc1ucq/
jsfiddle http://jsfiddle.net/harshdand/e0fc1ucq/
<div class="row">
<div class="col-sm-6">
<div class="form-group">
<select class="form-control">
<option>1</option>
<option>2</option>
<option>3</option>
</select>
</div>
</div>
<div class="col-sm-6">
<div class="form-group">
<select class="form-control">
<option>1</option>
<option>2</option>
<option>3</option>
</select>
</div>
</div>
</div>
回答by user2251695
class form-control in bootstrap has the display value of block. give it the class d-inline-block
bootstrap中的form-control类的显示值为block。给它类 d-inline-block
<select class="form-control d-inline-block">

