Firefox 中的字体非常小

Font size very small in firefox

我创建了一个网站,我希望标题 <h1> 调整其大小以及 <header> 的宽度。为此,我使用了 vw 属性。但是 属性 在 firefox 中不起作用,因为那里显示的字体非常小。

你可以在这个fiddle中明白我的意思。如果你在 firefox 中 运行 这个 fiddle,你会看到小字体。

Body {
  background: white;
  font-family: "Myriad Pro";
  size: 12px;
  color: #323232;
}
header {
  position: relative;
  width: auto;
  height: auto;
  max-height: 239px;
  min-height: inherit;
  background: #d1d2d4;
  overflow: hidden;
}
header h1 {
  font-family: "Arial";
  font-size-adjust: 0.10;
  font-size: 5vw;
  color: black;
  position: absolute;
  left: 13.5%;
  top: 25%;
}
header p {
  font-family: "Myriad Pro";
  font-size-adjust: 0.10;
  font-size: 2vw;
  color: #404041;
  position: absolute;
  left: 13.5%;
  top: 64%;
  letter-spacing: 2pt;
}
<header>
  <img src="images/Logo.png" style="margin-left:2.5%; margin-top:2.5%; width:10%; height:inherit;" />
  <h1 style="">Website®</h1>
  <p>Welcome To My Website!</p>
  <img src="http://tinyurl.com/ku6cgpy" style="align: right; float:right; width:40%; height:auto; overflow-style:auto; overflow:visible;" />
</header>

The Fiddle

谁能告诉我我做错了什么?

从您的 css

中删除 font-size-adjust: 0.1

这里是Fiddle

删除 header h1

中的 font-size-adjust: 0.1

Body {
  background: white;
  font-family: "Myriad Pro";
  size: 12px;
  color: #323232;
}
header {
  position: relative;
  width: auto;
  height: auto;
  max-height: 239px;
  min-height: inherit;
  background: #d1d2d4;
  overflow: hidden;
}
header h1 {
  font-family: "Arial";
  
  font-size: 5vw;
  color: black;
  position: absolute;
  left: 13.5%;
  top: 25%;
}
header p {
  font-family: "Myriad Pro";
  font-size-adjust: 0.10;
  font-size: 2vw;
  color: #404041;
  position: absolute;
  left: 13.5%;
  top: 64%;
  letter-spacing: 2pt;
}
<header>
  <img src="images/Logo.png" style="margin-left:2.5%; margin-top:2.5%; width:10%; height:inherit;" />
  <h1 style="">Website®</h1>
  <p>Welcome To My Website!</p>
  <img src="http://tinyurl.com/ku6cgpy" style="align: right; float:right; width:40%; height:auto; overflow-style:auto; overflow:visible;" />
</header>