我在样式上使用引导日期范围选择器下拉菜单的样式时遇到问题。
这是我想要的两张图片以及页面的外观:
这是我创建的表单的代码:
<div class="form-group" style="border: 1px solid">
<div class="row">
<div class="radio">
<label><input type="radio" name="optradio">Select Period
</label>
</div>
<div id="reportrange" class="pull-right" style="background: #fff; cursor: pointer; padding: 5px 10px; border: 1px solid #ccc;">
<i class="glyphicon glyphicon-calendar fa fa-calendar"></i>
<span></span> <b class="caret"></b>
</div>
</div>
<div class="row">
<div class="radio">
<label><input type="radio" name="optradio">Select Date</label>
</div>
</div>
<div class="row">
<div class="radio">
<label><input type="radio" name="optradio">Select Date Range</label>
</div>
</div>
</div>
您可以使用col-md- *引导程序类
<div class="form-group" style="border: 1px solid">
<div class="row">
<div class="col-md-2">
<div class="radio">
<label><input type="radio" name="optradio">Select Period</label>
</div>
</div>
<div class="col-md-3">
<div id="reportrange" class="pull-right" style="background: #fff; cursor: pointer; padding: 5px 10px; border: 1px solid #ccc; width: 100%">
<i class="glyphicon glyphicon-calendar fa fa-calendar"></i>
<span></span> <b class="caret"></b>
</div>
</div>
</div>
<div class="row">
<div class="col-md-2">
<div class="radio">
<label><input type="radio" name="optradio">Select Date</label>
</div>
</div>
</div>
<div class="row">
<div class="col-md-2">
<div class="radio">
<label><input type="radio" name="optradio">Select Date Range</label>
</div>
</div>
</div>
</div>
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句