仅在使用chrome刷新时出现CSS错误

Question

我的new site上有一个令人讨厌的CSS错误。 这是仅限铬的随机错误。它通常出现在第一次访问时，消失，刷新（F5）或窗口调整大小。要重新出现，您必须刷新页面（有时最多10次）。

当出现错误时，菜单栏的两个链接（＆＃34; Blog＆＃34;和＃34; Qui suis-je＆＃34;）的某些像素太低，并且在Chrome的外面计算机css盒（在开发工具中）。

["Blog" and "Qui suis-je" are some pixels too low http://img.ksxav.net/images/9cef242f87cd15f90519c7d84525e0ea.png]

这是一个带有和没有bug的gif：

在Google上搜索后，我尝试了以下方法：

• 修复清漆以避免304错误（描述错误here）
• 我尝试将用void addTitledTab(QTabWidget * tabWidget, QWidget * widget) { int index = tabWidget->addTab(widget, widget->windowTitle()); QObject::connect(widget, &QWidget::windowTitleChanged, [index, tabWidget](const QString & text){ tabWidget->setTabText(index, text); }); } 定位的CSS的所有内容复制到主CSS文件中（描述为here）
• 删除所有自定义css
• 我能够在4台不同的计算机（相同的Chrome版本）上重现该错误

相同的结果。我也在主题开发者的网站here上看到同样的事情。请记住，有时您必须刷新/关闭并重新打开标签才能查看它。

有人有想法吗？该主题的开发人员表示他无法重现该错误，但正如我所说，我在4台不同的计算机上看到了它......

谢谢。

以下是信息：

• Chrome 44.0.2403.89，根本没有插件
• Wordpress最新版（4.2.3）
• 主题最新

Answer 1

这看起来像是一个垂直对齐问题，但可能不是。但是，你可以在这里做几件事来试图强迫这个问题：

1. Drop floats

   a中的li子元素已浮动。这不是必要的，我建议删除它们。

1. 假它

   您没有理由依赖实际的文档流程来显示您想要的内容。我要提前警告你，这个人写起来很蠢，但就像魅力一样。

在原始a元素上

• 将a的文字复制到一个范围，然后将其放在另一个

  旁边

  示例

     

 <a href="/place/on/my/site">Mes chiennes</a>
 <span>Mes chiennes</span>

 
• 设置以下CSS规则：
 

 #nav li {
   position: relative;
 }
 #nav li span {
   visibility: hidden;
 }
 #nav li a {
   position: absolute;
   display: block;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
}

• 这是一个伏都教，我们让跨度保留了单词所需的实际空间，然后强制元素在标签内完美显示。 transform位只会拖动它，因此元素的中心位于您提供的top和left坐标处，因此请随意使用它们以获取它们所需的位置。< / LI>

希望有所帮助。