.datepicker在移动设备上的位置不当？

Question

在我的计算机上.datepicker正确显示在表单下方：

但在我的手机.datepicker上重叠了表单：

<%= f.text_field :deadline, id: "six", class: 'form-control', placeholder: 'Enter Deadline (Optional)' %>
<script>
  $( "#six" ).datepicker({
  dateFormat: "yy-mm-dd"
  });
</script>

的application.js

//= require jquery-ui/datepicker

application.css

*= require jquery-ui/datepicker

也许它与z-index有关？我在移动设备上使日历宽度尽可能小，而不会扭曲它。