0

我在页面顶部的固定导航栏遇到了一些问题。它应该与页面顶部齐平,但不是。这是我的 HTML:

<nav>
<a href="#">
<div id="logo">
lorem
</div></a>
</nav>

<ul>
*enough li's to go past the bottom of the screen*
</ul>

和我的 CSS:

body {
    margin: 0px;
    padding: 0px;
}

nav {
    position: fixed;
    display: block;
    color: white;
    margin: 0 auto;
    padding: 0;
    width: 100%;
    height: 60px;
    background-color: #4d4d4d;
}

#logo {
    padding-left: 1%;
    padding-right: 1%;
    color: #75cc83;
    width: 180px;
    height: 100%;
    background-color: #333333;
    font-size: 3em;
    font-family: candara, sans-serif;

}

一旦我将内容放在那里(在这种情况下是列表项),固定导航似乎只有问题

4

1 回答 1

0

添加top:0到您的导航规则:

nav {
    position: fixed;
    display: block;
    color: white;
    margin: 0 auto;
    padding: 0;
    width: 100%;
    height: 60px;
    background-color: #4d4d4d;
    top:0;
}

jsFiddle 示例

于 2013-10-16T20:05:46.063 回答