html - CSS 图像不触及顶部

Question

我正在创建一个水平导航栏，它会触及两种尺寸的屏幕。唯一的问题是它没有触及顶部(http://i.imgur.com/0zhNHgz.png，如您所见，黄色矩形没有触及顶部)我已经在 CSS 中这样做了:

html, body
{
    margin:0;
    padding:0;
}

HTML代码:

<div id="nav">
    <ul>
        <li><a href="/test">HOME</a></li>
    </ul>
</div>

我做错了什么？

Answer 1

我个人使用:

 *{
    padding: 0;
    margin: 0;
   /* I usually use this too: */
   box-sizing: border-box;
}

这会移除每个元素的填充和边距。阻止像你这样的事件发生在我希望一切都齐平的地方。它让我可以更好地控制元素。

问题，正如其他答案所述，您的 ul 也有填充。上面的代码将解决这个问题和任何 future 的问题。