Question

我有一个Bootstrap Navbar，它除了XS外都有各种大小的隐藏标题。好吧，在SM，MD，LG的大小中，Navbar的边界左边和我的第一个MenuItem之间有一个空格，我想赞成这个。然而，在正确的边缘不会发生这种情况。这是我的代码：

<nav id="idNavMenu" class="navbar navbar-default" role="navigation">

    {/*<a class="navbar-brand" href="/inicio"><img id="idFotoLogotipo" width="200px" src="./assets/images/cabecera_CE.jpg"/></a>*/}

    <a class="navbar-brand visible-xs-block" href="http://www.upct.es/"><span id="idTextoLogotipo">UPCT</span></a>

    <div class="navbar-header">
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
            <span class="sr-only">Menú</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        </button>
    </div>

    <div class="collapse navbar-collapse navbar-ex1-collapse">
        <ul class="nav navbar-nav navbar-left">
            <MenuNavItem to='/alumno/inicio' index={true} menuItemActive="inicio">Inicio</MenuNavItem>
            <MenuNavItem to='/alumno/nueva_incidencia' menuItemActive="nueva_incidencia">Nueva Incidencia</MenuNavItem>
            <MenuNavItem to='/alumno/mis_incidencias' menuItemActive="mis_incidencias">Mis Incidencias</MenuNavItem>
        </ul>

        <ul class="nav navbar-nav navbar-right">
            <MenuNavItem to=''><span class="glyphicon glyphicon-off"></span> Salir</MenuNavItem>
        </ul>
    </div>

</nav>

我怎么能解决这个问题？谢谢。

Answer 1

添加一些CSS以移除较大屏幕宽度上的padding-left ...

@media (min-width: 768px) {
    .navbar-ex1-collapse {
        padding-left: 0;
    }
}

http://www.codeply.com/go/6uRPnswd7J

边距/填充左侧带有隐藏标题的Bootstrap Navbar？

1 个答案: