Jump to content

Archived

This topic is now archived and is closed to further replies.

Heero

Navigation Bar Alignment Problem

Recommended Posts

Hey guys,

Here is a screenshot of what I have right now:
[img src=\"http://www.sfu.ca/~fcc/navigation.gif\" border=\"0\" alt=\"IPB Image\" /]

Notice how there is a line between the first and second line. That is fine. How do the second link text align itself all the way to the right side? Like this:

[img src=\"http://www.sfu.ca/~fcc/navigation2.gif\" border=\"0\" alt=\"IPB Image\" /]

My current code is:

<div id="navContainer_1">
<ul id="nav">
<li><a href="index.php">主頁</a></li>
<li><a href="register.php">申請及退出</a></li>
</ul>
</div>

<div id="navContainer_2">
<ul id="nav">
<li><a href="index.php">主頁</a></li>
<li><a href="register.php">申請及退出</a></li>
</ul>
</div>

NavContainer1 simply has the attribute float: left. What attribute do I put in navContainer 2 to make the links go all the way to right side?

Share this post


Link to post
Share on other sites
float right and give both div containers the width of 49% so they both sit sibe by the side of each other nicely.

This is the css you'll want:
[code]#navContainer_1, #navContainer_2 {
    width: 49%;
    float: left;
}

#navContainer_2 {
    float: right;
    text-align: right;
}[/code]

Share this post


Link to post
Share on other sites

×

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.