将<ul>元素放在右侧（流体导航）</ul>

Question

我试图创建一个坚持其父div元素右侧的ul元素。 ul应该是流动的，看看我到目前为止得到了什么。 Ul停留在左侧，希望它从右侧开始，以便联系人的李固定在右角。

jsfiddle here

HTML

<div>
    <ul>
        <li>home</li>
        <li>portfolio</li>
        <li>blog</li>
        <li>news</li>
        <li>contact</li>
    </ul>
</div>

的CSS：

div {
    width: 100%;
    border: 1px solid black;
}

ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
    width: 100%;
}

ul li {
    display: inline;
    padding: 0 0 0 5%;
}

ul li:after {
    content: "|";
    padding: 0 0 0 5%;
}

ul li:last-child:after {
    content: "";
    padding: 0;
}

Answer 1

知道我了解您只需要向text-align:right元素添加ul时遇到的问题。

ul {
margin: 0;
padding: 0;
list-style-type: none;
width: 100%;
text-align:right;
}