我确信这个问题已经被问过很多次了，但我不知道要搜索什么。
我有以下 HTML 和 CSS（请参阅 jsfiddle 的实例）：
<!--HTML-->
<body>
<div id="container">
<div id="header">
<ul>
<li>Item1</li>
<li>Item2</li>
</ul>
</div>
</div>
</body>
/* CSS */
#container {
background-color: red;
width: 400px;
height: 200px;
margin: auto;
}
#header ul {
list-style: none;
margin-top: 20px; /* I want this to be the margin at the top of the ul, not the container */
}
#header li {
float: left;
margin-right: 10px;
}
我遇到的问题是margin-top与<ul>. 它在 上方添加空间#container <div>，而不是在<ul>. 我一定错过了一些关于 CSS 的基本知识，因为我就是不明白这种行为。有人可以启发我吗？