html - 如何将 Bootstrap 日期选择器与 Bootstrap 列对齐？

Question

我正在使用 bootstrap 3.3.7 和 bootstrap datepicker v1.6.4。我已将日期选择器嵌入到类为 col-md-6 的 div 中，但它似乎没有填满该列。

HTML代码:

<div class="form-group">
     <label class="control-label col-lg-5 text-left">Select Date:</label>
     <div class="col-lg-6">
          <input type="text" class="form-control" placeholder="Choose your date..." readonly>
          <div id="datepicker" data-date-format="mm/dd/yyyy"></div>
     </div>
</div>

CSS:

<!-- Bootstrap 3.3.7 -->
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">
<!-- Bootstrap Datepicker -->
<link rel="stylesheet" href="bootstrap-datepicker/css/bootstrap-datepicker3.min.css">

JavaScript:

<!-- Bootstrap Datepicker -->
<script src="bootstrap-datepicker/js/bootstrap-datepicker.min.js"></script>

datepicker-image

datepicker-image

有办法解决这个问题吗？预先感谢您的建议。

Answer 1

它似乎是组件上的一些左填充。找到这个样式的来源并覆盖它

.datepicker-inline 类可能包含一些填充或宽度约束，或者可能从其他类继承