css - 为什么 pull-right 类在 bootstrap 版本 4.1.0 上不起作用？

Question

这个问题已经有答案了:

Bootstrap align navbar items to the right (24 个回答)

CSS float-right not working in Bootstrap 4 Navbar [duplicate] (3 个回答)

Right align element in div class (4 个回答)

已关闭 5 年前。

之前我们使用 bootstrap 版本 3+。现在我们使用4.1.0。当我尝试使用 pull-right 和 pull-left 对齐时，它不起作用。即使我尝试使用 float 右/ float 左它也不起作用。 (我在图像中提到了它的显示位置以及我希望它显示的位置)

这里的代码:

<nav class="navbar navbar-static-top">
        <a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
    <span class="sr-only">Toggle navigation</span>
        </a>
    <div class="header_text float-left ">Home</div>
    <div class="header_text float-right">Company Name</div>
    <div class="navbar-custom-menu ">
    <ul class="nav navbar-nav">
    <li class="dropdown user user-menu">
    <a href="#" class="dropdown-toggle float-right" data-toggle="dropdown"> <img src="./Images/user2-160x160.jpg" class="user-image" alt="User Image"> <span class="hidden-sm">Welcome</span> </a>
    <ul class="dropdown-menu">
        </ul>
    </li>
    </ul>
    </div>
    </nav>

在上面的代码中，我尝试使用 pull-right和pull-left起初，然后之后 我用过一些谷歌搜索float-left和float-right .仍然没有达到我预期的结果。请帮忙

供@soheilPs引用

Answer 1

检查变更日志: https://getbootstrap.com/docs/4.0/migration/#utilities

Added .float-{sm,md,lg,xl}-{left,right,none} classes for responsive floats and removed .pull-left and .pull-right since they’re redundant to .float-left and .float-right.

所以在你的情况下应该是

class="float-sm-right"