所以我在我的网站上用 Firefox 开发了一个配置文件(该网站在配置文件中接受 HTML)。然后我在 Chrome 中打开它，虽然我注意到它们之间存在差异和优缺点，但我并没有真正被任何事情困扰，除了我在顶部的音频播放器在 Firefox 中的样式正确，但在 Chrome 中不是。
在我看来，“高度”CSS 出于某种原因没有在 Chrome 中使用，同时它在 Firefox 中使用得很好。
知道如何解决这个问题吗？如果没有，至少帮助我让它在 Chrome 中正常显示，即使它必须是胖的而不是我想要的细条。至少我希望它能正常工作，而不是被页面遮挡，即使它不是我预想的那样。
我已经尝试了几个@media“hacks”以仅针对 Chrome/webkit，但他们都不接受。
有问题的个人资料位于 here (需要闪光灯)。来源可在来源选项卡中免费获得。 CSS 类名是 .BGM。
谢谢。
编辑: 差异图像:https://imgur.com/a/EQyqD
您可以看到问题 - 我希望它像在 Firefox 中一样正确显示，而不是像在 Chrome 中那样被压碎。实际上，我希望能够为 Chrome 进一步设计它的样式 - 使其在 Chrome 中的样式与在 Firefox 中的样式相同 - 尽管我猜测 Chrome 在这方面可能不如 Firefox 灵活。
PS:是的，疯狂的是一个网站在 2018 年仍然在 Flash over HTTP 上运行，是的，网站上的配置文件设计都是幼稚和前卫的。这是我的一种罪恶感 - 这是一个不错的小型编码 Playground 。
最佳答案
将 .bgm 类中的高度属性更改为更大的值，例如 30。
如果您真的很在意播放器在 Firefox 上的外观，您还可以在 .bgm 中引入一些仅限 Chrome 的边距:
-webkit-margin-before: 12px;
如果你想让 Chrome 播放器更 slim ，你需要研究 webkit masks，这需要一个额外的图像文件。
关于html - 如何更改 Chrome 中 <audio> 元素的高度？ (能够在 FF 中做得很好)，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/48472727/