0

我正在尝试对齐比原始导航栏短的第二个导航栏，以满足原始导航栏的右侧。可能没有多大意义，所以这里有一张图片可以提供帮助：http: //i49.tinypic.com/nohno7.jpg

顶部导航栏的 CSS 是：

#nav { width:940px; height:40px; margin:0 auto; padding:0; font-size:105%; background:url(../images/bg-nav.png) 0 0 repeat-x; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; box-shadow:0 0 3px #ccc; }

第二个导航栏的 CSS 是：

#nav2 { width:547px; height:40px; margin:1px auto; padding:0; font-size:105%; background:url(../images/bg-nav.png) 0 0 repeat-x; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; box-shadow:0 0 3px #ccc; }

如果有人可以帮助我指出正确的方向，那就太好了。

非常感谢。

4

2 回答 2

0

float:right可以解决您对第二个导航栏的问题吗？

编辑：我想我知道你的页面是什么样子的：你的导航栏就在body标签内。所以让我们做一些小改动：

  1. 添加一个包含两个导航栏的 div。让我们称之为nav-bar。
    <div id="nav-bar"><!--1st nav--><!--2nd nav--></div>

  2. 添加一些CSS：
    #nav-bar {width:940px;height:80px; margin:0 auto; padding:0;}
    #nav2 {float:right;}

并完成 nav2 的其余 css 希望这会有所帮助

于 2012-09-06T22:41:29.813 回答
0 
.nav-container2 { width:940px; margin:auto; height:30px;}
#nav2 { width:547px; height:40px; float:right; margin:1px 0 0 0; font-size:105%; background:url(../images/bg-nav.png) 0 0 repeat-x; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; box-shadow:0 0 3px #ccc; }
于 2012-09-06T23:07:47.073 回答