6

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

第一次： 在此处输入图像描述

第二次（及以后）时间： 在此处输入图像描述

我以前从未见过这样的问题，并且在搜索其他有关此问题的投诉时遇到了麻烦。关于从哪里开始调查的任何建议？

编辑

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

4

2 回答 2

2

好的 - 问题取决于多种因素

  • 只有空缓存才会发生
  • 取决于 font-awesome 和 bootsrap 的加载速度 - 如果它们的加载速度比您的徽标快...

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

您无法轻松修复加载竞争条件，但修复您的 css 应该可以：

  1. pull-left为您的徽标添加类
  2. clearfix通过将类应用于页眉来清除浮动区域
  3. 它不是必需的，但很好的选择，将width&添加height到您的徽标图像中，这样它就不会在加载后弹出

所以这里是：

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

希望有帮助。

于 2013-09-11T14:38:19.663 回答
0

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

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

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

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

于 2013-09-11T13:57:21.063 回答