Css 在铬合金中以较大尺寸加载的元素

我有一个问题只有在Chrome中才会出现。当我第一次加载站点中的任何页面时，导航栏中的H1和nav元素会变大。当使用inspect element进行检查时，我可以看到我的填充和边距是相同的，它们应该是什么，但它们本身的元素更高、更宽。这是一个完全响应的网站，所以当我调整浏览器的大小时，@media规则开始发挥作用，元素会返回到它们应该的大小。但是如果我以@media大小刷新，它会再次以错误的大小加载它

如果有人知道这可能是什么原因，我将非常感谢有一些见解

注意：我尝试了线高度：0；高度：自动；无济于事

HTML

---

在JSFIDLE中共享您的代码。我没有任何javaScript，但我将尝试添加相关代码。您可以在不使用javaScript的情况下创建JSFIDLE。它为每个想帮助您的人省去了自己手动复制的麻烦。此外，您发布的代码不包含任何媒体查询。我找不到任何差异，在chrome和FFI中测试，它是否只发生在第一页加载？？

<header>
<a href="index.html"><h1><span id="logo">Design</span>Basics</h1></a>
<nav id="nav">
<a href="principles.html" id="navp">Principles</a>
<a href="type.html" id="navt">Typography</a>...
</nav>
</header

* { -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;}

p,html,img,body,div,h1,h2,h3,h4,dd,header,main,section,nav {
  margin: 0;
  padding: 0;}

a {text-decoration: none;}

ol,ul {list-style-type: none;}

html {font-size: 62.5%; min-height: 100%;}
body {height: 100%; background-color: #eee; color: #ffe;}

body, p { font-size: 1.6rem; line-height: 150%; font-family: 'Open Sans',
  'Helvetica Neue', Helvetica, Arial, sans-serif;}

h1, h2, h3, h4, nav a { text-transform: uppercase; font-family: 'Oxygen',
  'Helvetica Neue', Helvetica, Arial, sans-serif; letter-spacing: .3rem;}
h1 {font-weight: 700; font-size: 3rem; color: #444;}

header { background: rgba(250,250,250,0.9);
  border-bottom: 1px solid rgba(190,190,190,0.95);
  position:fixed; width: 100%;
  box-shadow: 0px -5px 20px rgba(100,100,100,0.6); }
header h1 {float:left; padding: .8rem 1% .95rem 2%;}
header hr { color: #ddd; size:1px; width:60%; display:none;}
h1 span#logo { font-family: 'Open Sans', 'Helvetica Neue', Helvetica,
  Arial, sans-serif; font-weight: 300; letter-spacing: .7rem;}
nav{ float:right; margin: .9rem 1.5rem .95rem 1rem; font-size: 1.6rem;
  letter-spacing: .2rem; transition: 1s height;}
nav a { color: #bbb; margin: 0 1.5rem; transition: .6s color;
  font-weight: 300; height: auto;}
nav:hover a {color: #ddd;}
a#navp:hover, a#navt:hover, a#navc:hover, a#navr:hover {color: #888;}