html - Bootstrap v4 右浮动不起作用。 [右拉的替代品]

Question

基本上，我有最新版本的 bootstrap Currently v4.0.0-beta.3 并且我无法让元素与官方文档正确对齐。我在网上搜索解决方案，但一无所获。他们都是关于用 right: 0; 创建一个新类，但这不是重点。谁能告诉我我做错了什么，还是只是一个错误？

我还发现一篇帖子对 flex 是问题所在表示遗憾，但他们没有解释原因或如何解决它。

我什至拿了他们的官方示例，从文档中看，它不起作用。这是示例:

<div class="float-left">Float left on all viewport sizes</div><br>
<div class="float-right">Float right on all viewport sizes</div><br>
<div class="float-none">Don't float on all viewport sizes</div>

结果:

在所有视口(viewport)尺寸上向左浮动在所有视口(viewport)尺寸上向右浮动不 float
所有视口(viewport)尺寸

我把它们放在一个 div 和 row 类中，没有任何改变。

对于那些不知道的人，Bootstrap 在最新版本中删除了 pull-right 类，并用 float-right 替换了它。

Answer 1

在bootstrap中，行只能包含列，所以你必须在行内至少添加一列

失败

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.3/css/bootstrap.min.css" rel="stylesheet" />

<div class="row">
  <div class="float-left">Float left on all viewport sizes</div><br>
  <div class="float-right">Float right on all viewport sizes</div><br>
  <div class="float-none">Don't float on all viewport sizes</div>
</div>

作品

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.3/css/bootstrap.min.css" rel="stylesheet" />

<div class="row">
    <div class="col">
        <div class="float-left">Float left on all viewport sizes</div><br>
        <div class="float-right">Float right on all viewport sizes</div><br>
        <div class="float-none">Don't float on all viewport sizes</div>
    <div>
</div>