Html Bootstrap 4.1导航栏最大宽度和自动边距

Html Bootstrap 4.1导航栏最大宽度和自动边距,html,css,bootstrap-4,navbar,margin,Html,Css,Bootstrap 4,Navbar,Margin,我正在尝试将引导4.1导航栏限制为最大宽度1333px,居中并具有左右自动边距。什么都没用。包装容器,使用!重要的。。。有什么帮助吗 我的代码: <div class="container" style=""> <nav class="navbar fixed-top navbar-expand-lg navbar-light rounded mx-auto" id="menu"> <button class="navbar-toggler" typ

我正在尝试将引导4.1导航栏限制为最大宽度1333px,居中并具有左右自动边距。什么都没用。包装容器,使用!重要的。。。有什么帮助吗

我的代码:

 <div class="container" style="">
<nav class="navbar fixed-top navbar-expand-lg  navbar-light rounded mx-auto" id="menu">       <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#nawigacja" aria-controls="nawigacja" aria-expanded="false" aria-label="przycisk nawigacyjny"> <span class="navbar-toggler-icon"></span></button>
    <div class="collapse navbar-collapse " id="nawigacja">
  <a class="navbar-brand" href="index.php"><img class="img-fluid float-right" src="logo.png" id="logo" alt="logo"/></a>
        <ul class="navbar-nav  ">
            <li class="nav-item dropdown">
                <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">

    </a>
                <div class="dropdown-menu navbar-light" aria-labelledby="navbarDropdown">

                    <a class="dropdown-item" href="odzyskiwanie_danych.php">abc</a>
                    <a class="dropdown-item" href="a.php">aaa</a>
                    <a class="dropdown-item" href="b.php">aaa</a>
                    <a class="dropdown-item" href="c.php">aaa</a>
                    <div class="dropdown-divider"></div>
                    <a class="dropdown-item" href="a.php">aaa</a>
                    <a class="dropdown-item" href="aaa.php">aaaa</a>
                </div>
            </li>



            <li class="nav-item dropdown">
                <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
     aaaa
    </a>
                <div class="dropdown-menu" aria-labelledby="navbarDropdown">
                    <a class="dropdown-item" href="pp.php">Saaa</a>
                    <a class="dropdown-item" href="formularz_pp.php">aaa</a>
                </div>
            </li>

            <li class="nav-item dropdown">
                <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
      aaa
    </a>
                <div class="dropdown-menu" aria-labelledby="navbarDropdown">
                    <a class="dropdown-item" href="aaa.php">Dane adresowe</a>
                    <a class="dropdown-item" href="aaaa.php">a</a>
                    <div class="dropdown-divider"></div>
                    <a class="dropdown-item" href="aaa.php">Faaa</a>
                </div>
                <a class="nav-link" style=""><img src="t-small.png" /> 1234567</a>
            </li>



        </ul>
    </div>
</nav>
</div>
所有在线粘贴到我的代码中的“有效”示例都不起作用:(

试试这个CSS:

nav.navbar {
    max-width: 1333px; /* applying max-width */
    margin: 0 auto; /* center */
    .navbar-collapse {
        justify-content : center; /* center the elements in the block if there is flex */
        -webkit-justify-content : center; /* make it works on some navigators */
    }
}

这应该可以工作

如果导航栏有固定的位置,这将不起作用……可能是这样吗?为什么不在.navbar上使用“仅使用”
max width:1333px;
nav.navbar {
    max-width: 1333px; /* applying max-width */
    margin: 0 auto; /* center */
    .navbar-collapse {
        justify-content : center; /* center the elements in the block if there is flex */
        -webkit-justify-content : center; /* make it works on some navigators */
    }
}