开发者

HTML & CSS Horizontal menu with items on left & right

I'm building an horizontal menu in HTML+CSS. The current result is fine, except I want to have some items on the left, and others on the right. I couldn't find useful result on Google with such common keywords so I'm asking on SO.

Here's my code so far:

#menu
{
    background-color: #383838;
    height: 65px;
    margin-bottom: 20px;
}

#menu ul li
{
    float: left;
}

<div id="menu">
    <ul>
        <li>Link 1</li>
        <li>Link 2</li>
        <li>Link 3</li>
    </ul>
</div>

I'd like to have Link 3 on the right, so the space between link 2 and 开发者_如何学JAVA3 should be filled at maximum. I don't want a filler <li> tag, but instead apply a class to the last <li> on the left, or the first <li> on the right. Don't want to adjust the width as I've a :hover background color changing effet on the links. I suppose margin or padding should do the trick but I can't manage to find how.

Any clue?


Have you tried applying a float: right; style to the <li>Link 3</li> element?

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜