为啥按钮向左移动？

Posted 2023-02-22

【中文标题】为啥按钮向左移动？

【英文标题】：Why are the buttons shifted left?为什么按钮向左移动？

【发布时间】：2021-09-22 17:01:45

【问题描述】：

在 Node、React、Express 上学习 Udemy 教程。

他正在使用页眉，他的代码将登录和购物车链接移到最右边。我有和他一样的代码，但我的链接没有移到最右边。我按照教程使用 React-bootstrap。我的代码是一样的吗？

<header>
  <Navbar bg='dark' variant='dark' expand='lg' collapseOnSelect>
    <Container>
      <Navbar.Brand href='/'>BShop</Navbar.Brand>
      <Navbar.Toggle aria-controls='basic-navbar-nav' />
      <Navbar.Collapse id='basic-navbar-nav'>
        <Nav className='ml-auto'>
          <Nav.Link href='/cart'>
            <i className='fas fa-shopping-cart'></i>Cart
          </Nav.Link>
          <Nav.Link href='/login'>
            <i className='fas fa-user'></i>Login
          </Nav.Link>
        </Nav>
      </Navbar.Collapse>
    </Container>
  </Navbar>
</header>

【参考方案1】：

也许您使用的是最新的 bootstrap v5，它将它们的 ml 和 mr util 类更改为 ms 和 me。

在 v5 中，left 和 right utils 已更改为 start(s) 和 end(e)[1]。所以，尝试将ml-auto 替换为ms-auto。

参考：

https://getbootstrap.com/docs/5.0/migration/#utilities