HTML页面加载不同的第一次和第二次（谷歌浏览器）

Question

我有一个HTML页面，第一次加载时会加载一种方式，第二次加载另一种方式。这可以在私人模式下使用Chrome重现（因为它每次都会清除缓存）。

第一次：

第二（及更晚）时间：

我之前没有看到这样的问题，而且我在搜索其他投诉方面遇到了麻烦。关于从何处开始调查的任何建议？

的修改

感谢所有反馈。只是为了澄清一些事情。 CSS只是标准的Bootstrap 3.0，没有其他样式或CSS。该网址为https://www.acls.net/index-exp120.php，这是Chrome私密模式，其中所有扩展程序均已停用。我只在Chrome中看到此问题，已更新标题以反映这一点。

Answer 1

好的 - 问题取决于多个方面

• 只能在空缓存中发生
• 取决于font-awesome＆amp;的加载速度。靴子 - 如果他们的装载速度比你的徽标还要快......

因此，在以隐身模式运行Chrome并一次又一次重新加载时，我最终可以重现此问题。

您无法轻松修复加载竞争条件，但修复您的CSS应该有效：

1. 将班级pull-left添加到您的徽标
2. 通过将类clearfix应用于页眉
来清除浮动区域
3. 这不是必要但是很好的选择，添加width＆amp; height到您的徽标图片，因此一旦加载就不会弹出

所以这是：

<div class="page-header clearfix">
    <a href="/" class="logo pull-left"">
        <img src="images/logo.png" height="62" width="232" alt="">
    </a>

希望有所帮助。

Answer 2

要研究的一些主要问题。 浏览器大小。 它在某一点上比另一点更宽吗？

它显然位于同一浏览器中，但为了以防万一，我会在多个浏览器中测试它，因为您确实希望您的代码是交叉兼容的。

对我而言，这看起来像是一个宽度问题。

也许你有一个#login div，或者一些奇怪的名字，在右上方包含该内容并浮动它，并且内容没有响应，但div本身就是。当div缩小一点时，内容本身并没有将内容的其余部分推下来。