Question

我有div大小col-md-4的导航，我有6个标签，我无法查看所有标签。

我可以在更改文本标签的字体大小时使用，这对我来说不是一个好方法。

我尝试为每个标签设置宽度，但不起作用。如何将某些标签的宽度设置为较小但第二个较大。

当我将鼠标悬停在导航栏的末尾时，我也有填充

http://i.imgur.com/9Px4qqk.png

        <nav class="row">
            <ul class="nav nav-tabs">
                <li class="tab1"><a href="#"> <span class="glyphicon glyphicon-user"></span> Name &nbsp &nbsp<span class="glyphicon glyphicon-chevron-down"></span> </a></li>
                <li><a href="#"><span class="glyphicon glyphicon-flag"></span>Text Link </a> </li>
                <li><a href="#"> <span class="glyphicon glyphicon-envelope"></span> Message </a> </li>
                <li><a href="#"> <span class="glyphicon glyphicon-oil"></span>10 </a> </li>
                <li class="tab5"><a href="#"><span class="glyphicon glyphicon-asterisk"></span> </a> </li>
                <li><a href="#"><span class="glyphicon glyphicon-home"></span> </a> </li>
            </ul>



    </div>

CSS

.nav-tabs li .tab5{

    width:4%;
}

Answer 1

你的选择器错了，你必须这样做：

.nav-tabs li.tab5 {
    width: 4%;
}

课程.tab5位于li标记上，因此您必须将它们连接起来。

Working Example

<强>更新

如果你想把所有人都放在一行中，试试玩填充，如下所示：

.nav>li>a {
    padding: 10px 3px;
}

Updated Example

为什么我无法为导航标签设置宽度

1 个答案: