Bootstrap 推拉选项似乎不起作用

Question

我正在尝试使用拉和推网格选项，但它们似乎不起作用。我认为它来自我对 bootstrap css 和/或 js 的集成（不确定 push/pull 是通过 js 还是 CSS 完成）。

我添加了一个应该在我的网页最顶部工作的推拉：

<div class="row">
<div class="col-md-9 col-md-push-3">Should be on the right</div>
<div class="col-md-3 col-md-pull-9">Should be on the left</div>
</div>

在此URL： http://www.dylog.test.resamarket.com/clients/connexion

我不知道为什么它不起作用，我不确定从哪里开始调查。

Answer 1

push/pull 类应用不正确。

格式为：

[push|pull]-[viewport size]-[column count].

我突出显示了其中一列，以便您可以更轻松地查看交换。

.col-md-9.push-md-3 {
  background-color: #fc0;
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.5/css/bootstrap.min.css" rel="stylesheet" />
<div class="container">
  <div class="row">
    <div class="col-md-9 push-md-3">.col-md-9 .push-md-3</div>
    <div class="col-md-3 pull-md-9">.col-md-3 .pull-md-9</div>
  </div>
</div>

Answer 2

我看到您使用的是 bootstrap 4.0 alpha 的下载版本。如果我添加以下行：

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

在 <title> 标记之后和您的调用之上，它工作正常。不确定为什么这样做，因为文件看起来不错。我建议尝试使用 Bootstrap.

的生产版本

col swap http://webdevpdx.com/soverflow/col-swap.png

Bootstrap 推拉选项似乎不起作用

Bootstrap push and pull options does not seems to work

javascript

css

grid

bootstrap-4