javascript - 在 Bootstrap 表单/页面底部添加填充/空间

Question

我正在开发一个 Bootstrap 表单，该表单底部有重置/提交按钮。当 iPhone 上的用户点击“提交”按钮时(它出现在屏幕最底部)，Safari 图标首先出现，然后用户必须第二次点击“提交”按钮。

这是表单结尾的代码:

<button type="reset" class="btn btn-default">Reset</button>
<button type="submit" class="btn btn-default">Submit</button>
</form>
</div>
<!-- /container -->


<script src="assets/js/jquery.min.js"></script>

</body>

</html>

以下屏幕截图显示了用户单击“提交”按钮之前的外观:

这是您第一次单击“提交”按钮时看到的内容:

迫使他们第二次单击“提交”按钮。寻求有关在表单/按钮后添加一些空间/填充以提供更多空间的最佳方法的建议，这样当他们滚动到底部时就不必单击两次。

Answer 1

如果您想要额外的间距，您可以为表单指定 margin-bottom，例如 50px

.form{
  position: relative;
  margin-bottom: 50px;
}

或者

但不建议这样做。您可以使用 bootstrap 创建一行，该行可能会占用一些默认空间。

<div class="row">
  <div class="col-md-12">
  </div>
</div>