html - 防止元素在 Chrome 中跳来跳去

Question

查看http://myhymnal.net/2上的页面。在 Chrome 中，当页面加载标题和歌词（键选择器和链接）之间的所有其他元素时，似乎会移动一点。当您将鼠标悬停在这两个部分上时，也会发生同样的情况。似乎与不透明度和/或 CSS 过渡有关？

据我所知，这只发生在 Chrome 中，我不明白这里发生了什么，因为它在 FireFox、Opera 和 IE 中都运行良好。

我的 CSS 或标记有什么问题吗？或者它是 Chrome 中的一个错误？或者这里发生了什么？有什么方法可以防止它发生吗？

Answer 1

更改您的font声明：

body, input, textarea, select {
    font: 120%/1.5 'Helvetica Neue', Arial, 'Liberation Sans', FreeSans, sans-serif;
}

至

body, input, textarea, select {
    font: 100% 'Helvetica Neue', Arial, 'Liberation Sans', FreeSans, sans-serif;
}

似乎您的所有元素都根据此缩放，因为它们在em.

我可能对描述有误，但解决方案有效:)