我的react应用程序中有一个引导导航栏，我添加了一个基于auth0身份验证的管理下拉列表。因此，基本上，如果我登录，我会看到管理菜单，如果我没有，我不会。此代码用于工作，菜单始终显示在一行上。现在我的注销按钮下降到第2行。
所有项目的导航栏，并添加登录按钮或管理菜单和注销按钮-->

export const NavigationBar = () => (
  <Styles>
    <Navbar expand="lg" fixed="top" >
      <Navbar.Brand href="/">World Of Elrue</Navbar.Brand>
      <Navbar.Toggle aria-controls="basic-navbar-nav" />
      <Navbar.Collapse id="basic-navbar-nav">
        <Nav className="ml-auto">
        <Nav.Link href="/">Home</Nav.Link>
        <Nav.Link href="/about">About</Nav.Link>
        <Nav.Link href="/wallbreak">Wallbreak</Nav.Link>
        <Nav.Link href="/regions">Regions</Nav.Link>
          <NavDropdown alignRight title="Races" id="dropdown-menu-align-right">
            <NavDropdown.Item href="/races/Desc">Races General</NavDropdown.Item>
            <NavDropdown.Divider />
            <h6 align="center">Humanoid Races</h6>
            <NavDropdown.Divider />
            <NavDropdown.Item href="/races/Dwarves">Dwarves</NavDropdown.Item>
            <NavDropdown.Item href="/races/Humans">Humans</NavDropdown.Item>
            <NavDropdown.Item href="/races/Elves">Elves</NavDropdown.Item>
            <NavDropdown.Item href="/races/Gnomes">Gnomes</NavDropdown.Item>
            <NavDropdown.Item href="/races/Orcs">Orcs</NavDropdown.Item>
            <NavDropdown.Divider />
            <h6 align="center">Other Creatures</h6>
            <NavDropdown.Divider />
            <NavDropdown.Item href="/races/Other">Other</NavDropdown.Item>
          </NavDropdown>
        <AuthNav />
        </Nav>
      </Navbar.Collapse>
    </Navbar>
  </Styles>
)

authnav只是添加了身份验证按钮

const AuthNav = () => (
  <div className="navbar-nav ml-auto">
    <AuthenticationButton />
  </div>
);

export default AuthNav;

authentication按钮显示auth0的状态，并显示login或admin和logout

const AuthenticationButton = () => {
  const { isAuthenticated } = useAuth0();

  return isAuthenticated ? 
    <div>
      <NavDropdown title="Admin" id="dropdown-menu-align-right">
        <NavDropdown.Item href="/CreateMap">Create Map</NavDropdown.Item>
        <NavDropdown.Item href="/EditMap">Edit Existing Map</NavDropdown.Item>
        <NavDropdown.Item href="/Profile">User Profile Auth0</NavDropdown.Item>
      </NavDropdown>
      <LogoutButton />
</div>
  : <LoginButton />;
};

export default AuthenticationButton;

注销曾经显示在我的管理菜单旁边的单个导航栏行上，由于某种原因，现在它会下降到第2行。我希望所有项目都在一行上
另外，从截图上看，我没有空间了，但这是正确的，只占了总页面的1/3，所以这不是空间问题