将 li 元素右对齐

Question

将 li 元素右对齐

我想将我的 li 元素之一移到右侧，我查看了其他解决方案，但它们不起作用。li.right{ text-align: right;}应该可以，但也许它被以前的 css 取消了？

<body>
    <nav class="navbar navbar-default navbar-fixed-top">
        <div id="navbar container">
            <ul class="nav navbar-nav">
                <li><a href="#">Mac</a></li>
                <li><a href="#">Iphone</a></li>
                <li><a href="#">Ipad</a></li>
                <li><a href="#">Watch</a></li>
                <li class="right"><a href="#">Log In</a></li>
            </ul>
        </div>

    </nav>
</body>

Run Code Online (Sandbox Code Playgroud)

这是CSS

.navbar {
    min-height:32px !important
}

.navbar .navbar-nav {
  display: inline-block;
  float: none;
  vertical-align: top;
}


.navbar{
  text-align: center;
  padding-top: 5px;
}

.navbar{
    font-family: "Times New Roman", Times, serif;
    font-size: 20px;
}

li.right{
    text-align: right;
}

Run Code Online (Sandbox Code Playgroud)

Answer 1

Stu*_*art 6

使用为此目的设计的引导内置类会更干净：

<nav class="navbar navbar-default navbar-fixed-top">
    <div id="navbar container">
        <ul class="nav navbar-nav">
            <li><a href="#">Mac</a></li>
            <li><a href="#">Iphone</a></li>
            <li><a href="#">Ipad</a></li>
            <li><a href="#">Watch</a></li>
        </ul>
        <ul class="nav navbar-nav navbar-right">
            <li><a href="#">Log In</a></li>
        </ul>
    </div>
</nav>

Run Code Online (Sandbox Code Playgroud)

归档时间：	8 年，11 月前
查看次数：	30446 次
最近记录：	8 年，11 月前