我目前正在创建一个表单,但是如果我添加一个带有input-group-addon的输入组,那么该输入将与其他输入不对齐.
插件似乎影响输入的宽度.
我的部分代码：
<div class="form-group">
<label for="inputName" class="col-sm-2 control-label">Name</label>
<div class="col-sm-3">
<input type="text" class="form-control" id="inputName" placeholder="Name" name="name" value="{{name}}" onblur="isEmpty(this)">
</div>
</div>
<div class="form-group">
<label for="inputLastSeen" class="col-sm-2 control-label">Last Seen</label>
<div class="col-sm-3 input-group date form_datetime"
data-link-field="inputLastSeen">
<input type="text" class="form-control" value="" readonly>
<span class="input-group-addon">
<span class="glyphicon glyphicon-th">
</span>
</span>
</div>
<input type="hidden" id="inputLastSeen" name="lastSeen" value="">
</div>
**我使用http://www.malot.fr/bootstrap-datetimepicker/demo.php作为DateTimePicker
解决方法
阅读
the input group docs:
Don’t mix with other components
Do not mix form groups or grid column classes directly with input groups. Instead,nest the input group inside of the form group or grid-related element.
(重点补充)
所以代替：
<div class="col-sm-3 input-group">
你要：
<div class="col-sm-3">
<div class="input-group">