基本保证金重置不起作用

Question

我不想要默认的边距，所以我尝试了* {margin: 0}，结果很奇怪（就像一个负值）。实际上，基本重置工作正常，直到我设置navigation类。

CodePen

header {
  font-family: Hervana, sans-serif;  
  display: flex;
  justify-content: space-between;
  flex-direction: row;
  background: grey;
}

header h1 {  
  padding-left: 1em;
}

.navigation {
  display: flex;
  list-style: none;
  padding-right: 1em;
}

.navigation a {
  color: black;
  padding: 1em;
  text-decoration: none;
  display: inline-block; 
}

<div class="layout">
  <header>
    <h1>Logo</h1>

    <nav>
      <ul class="navigation">
        <li><a href="#">Home</a></li>
        <li><a href="#">About</a></li>
        <li><a href="#">Products</a></li>
        <li><a href="#">Contact</a></li>
      </ul>
    </nav>
  </header> <!-- END HEADER -->
</div> <!-- END LAYOUT -->

Answer 1

使用

html,body {
  margin: 0;
}

Demo here

而不是使用*，他们也可以使用很多css-reset 我怀疑的是Css-Reset