当网页向上滚动时，引导日期时间选择器表单重叠

Question

我使用以下代码在我的页面上创建了两个datatimepicker元素：

  <h3>Start Date Time</h3>
   <div class="form-group">
    <div class="input-group date form_datetime_start">
      <input class="form-control" readonly disabled>
      <span class="input-group-addon"><span class="glyphicon glyphicon-th">
      </span></span>
    </div>
  </div>

也使用以下文件：

<link href="css/bootstrap/bootstrap.min.css" rel="stylesheet">
<link href="css/bootstrap/bootstrap-datetimepicker.min.css" rel="stylesheet">
<script src="js/bootstrap.js"></script>
<script src="js/bootstrap-datetimepicker.js"></script>

和jquery代码：

$('.form_datetime_start').datetimepicker({
    format: "dd MM yyyy - hh:ii",
    autoclose: true,
    todayBtn: true,
    clearBtn: true,
    startDate: "2017-07-23 10:00",
    minuteStep: 5
});

它可以正常工作，当网页向上滚动时表单重叠的唯一问题。第一个图像是未滚动的页面，第二个图像是滚动的页面

我可以做些什么来解决这类问题？

Answer 1

从屏幕截图看，该字段的堆栈顺序高于固定标头。您可以尝试为固定标头设置更高的z-index属性，例如

.header{ //define your class for the fixed header
    z-index: 100;
}