网站在除 Chrome 之外的所有浏览器上运行良好答案

【问题标题】：Website working well on all browsers except for Chrome网站在除 Chrome 之外的所有浏览器上运行良好
【发布时间】：2017-04-06 03:19:41
【问题描述】：

我刚刚在这个网站上完成了昆虫谷物的工作（是的......），虽然该网站似乎在边缘、野生动物园和 Firefox 上运行得非常好，但它在 chrome 上却有一个连续的长滚动，在它应该是结束（就在页脚之后）。我确信这有一个非常简单的解决方法，但是我在编码方面非常生疏，似乎找不到它。

提前致谢。

【问题讨论】：

从您的 <button id="button-white"> 中删除 bounceInUp
您需要在此处发布一个显示问题的最小示例。指向您的网站或任何第三方的链接是不可接受的，并且最终会删除此问题。 stackoverflow.com/help/mcve

标签： javascript html css google-chrome

【解决方案1】：

如果你尝试删除会怎么样

height: 100%

来自 CSS 中的 html 元素

【讨论】：

这不是问题。

【解决方案2】：

好吧，除了这里的所有答案，这个问题其实很有趣，让我们分解一下：

问题

您的页脚长度是由在 content-section-d 中添加到您的 #button-white 的类 bounceInUp 引起的，我通过删除 DevTools 中的部分和子节点发现了这一点，直到我指出了您的问题。

原因

这在 Chrome 中不起作用的原因是因为像这样的转换（使用 animate.css）是针对 inline 元素的，你的 <button> 不是一个，你应该应用自定义 CSS 来改变它，所以：

button-white {
    display: inline-block;
    margin-top: 30px;
    background: white;
    color: #02E0C6;
    border: none;
    border-radius: 0%;
    padding: 15px 15px 15px 15px;
}

除了其他答案之外，您还应该检查代码是否存在无效语法。在不同的浏览器中可能会出现很多问题。

【讨论】：

【解决方案3】：

看来您的标记有问题

<body>
  <header>
 <nav class="navigation navbar navbar-default navbar-fixed-top">
  <div class="container-fluid">
    <div class="navbar-header">
      <a class="navbar-brand" href="#">
        <img id="brand" class="img-circle" alt="Brand" src="http://i.imgur.com/0fIyMnA.png">
      </a>
      <h1 id="Criks" class="navbar-text">Criketos </h1>

    </div>
    <button id="navButton" class="navbar-text navbar-right btn btn-info">Buy Now</button>

 </a> **<----------- what is it?**

  </div>
</nav>
</header>

<body>

....

</body>
<script src='https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js'></script>
 <script src="index.js"></script>
</body>

</html>

【讨论】：

这不是问题。
你为什么这么认为？有+100500个未闭合或不必要的闭合标签，两个body标签...等。如果您有无效标记，所有浏览器都会显示不同的结果。
因为 HTML 对于 HTML 标记的不当使用有一个非常好的回退。他的主要问题是#button-white 类bounceInOut
我并不是说不应该解决这个问题，degr，只是这不是他的问题的原因:)。
如果没有直接原因导致此类奇怪问题的一种检查方法是删除 DevTools 中的部分，直到您“消除”问题，然后继续查明删除子节点，直到找到罪魁祸首.