Question

我正在尝试制作宽度为100％的HTML / CSS导航栏。现在，它的两侧有一些小区域，而不是导航栏。

我没有使用绝对或相对定位。

您可以在此处查看我的代码http://jsfiddle.net/una5kpx9/1/

    <div id="nav">
        <div id="nav-inner">
             <p>Text Goes Here &nbsp;&nbsp;</p>
        </div>
    </div>

CSS：

#nav { float: left; clear: both; width: 100%;  padding: 0; background: #787F6C;}
#nav-inner { float: left; clear: both; width: auto; padding: 10px 20px; background: transparent; }

任何帮助表示赞赏，
感谢

Answer 1

您需要添加：

body { margin:0 }

没有：http://jsfiddle.net/9uzp5xgr/
使用：http://jsfiddle.net/r564nu9f/

或者，如果您想在滚动时关注导航栏，可以将位置设置为绝对值：

nav {
position:absolite;
top:0;
right:0;
left:0;
height:50px
}

Navbar 100％页面宽度

1 个答案: