Я перепробовал все очевидные вещи, такие как добавление оправдания навигации, но, похоже, ничего не работает. Правильно ли построена эта панель навигации?
<nav id="NavMain" class="navbar navbar-expand navbar-light bg-light"> <div class="collapse navbar-collapse"> <ul class="nav nav-justified"> <li class="nav-item dropdown"> <a class=" nav-link dropdown-toggle" role="button" data-target="#ProductsMenu" data-toggle="dropdown">Menu a</a> <div id="ProductsMenu" class="dropdown-menu"> <a class="dropdown-item" href="a1.html">A.1</a> <a class="dropdown-item" href="a2.html">A.2</a> <a class="dropdown-item" href="a3.html">A.3</a> <a class="dropdown-item" href="a4.html">A.4</a> </div> </li> <li class="nav-item dropdown"> <a class="nav-link dropdown-toggle" role="button" data-target="#ServicesMenu" data-toggle="dropdown">Menu B</a> <div id="ServicesMenu" class="dropdown-menu"> <a class="dropdown-item" href="b1.html">B.1</a> <a class="dropdown-item" href="b2.html">B.2</a> </div> </li> <li><a class="nav-item nav-link" href="C.html">C</a> </li> <li><a class="nav-item nav-link" href="#">D</a> </li> <li><a class="nav-item nav-link" href="#">E</a></li> </ul> </div> </nav>
вместо .nav-juscted, попробуйте это:
<ul class="nav d-flex justify-content-between">
и добавьте
.nav { ... width: 100%; }
Чтобы быть совершенным, вы не упоминаете, как вы будете sh, чтобы уравновесить элемент