Question

我有一个bootstrap导航栏，如下所示：

PHP：

    <?php 

    $pg = pathinfo($_SERVER['PHP_SELF'], PATHINFO_FILENAME);

    if ($pg == "index") {
      $navbarposition = "navbar-fixed-bottom";
    } else {
      $navbarposition = "navbar-fixed-top";
    }

    echo "<body>";
    echo "<nav class='navbar navbar-default " . $navbarposition . " navbar-inverse' role='navigation'>"

    ?>
        <ul class="nav navbar-nav">
            <li id="about" <?php if($pg == 'about'){echo 'class="active"';} ?> ><a href="about.php">About</a></li>
            <li id="staff" <?php if($pg == 'staff'){echo 'class="active"';} ?> ><a href="staff.php">Staff</a></li>
            <li id="contact" <?php if($pg == 'contact'){echo 'class="active"';} ?> ><a href="contact.php">Contact</a></li>
            <li id="dates" <?php if($pg == 'dates'){echo 'class="active"';} ?> ><a href="dates.php">Dates</a></li>
        </ul>
    </nav>
    </body>

CSS：

    .navbar-nav {
        width: 100%;
    }

    .navbar-nav > li {
        width: 25%;
        text-align:center;
    }

    .navbar-collapse.collapse {
    display: block!important;
    }

    .navbar-nav>li, .navbar-nav {
    float: left !important;
    }

    .navbar-nav.navbar-right:last-child {
    margin-right: -15px !important;
    }

    .navbar-right {
    float: right!important;
    }

每当我将页面宽度设置得更小时，在某个断点处，导航栏的高度会增加，但文本不会换行（所有单词按钮）我如何捕获它并覆盖它以保持相同的高度？

如何保持导航栏高度相同

0 个答案: