0

[根据我老板的要求删除了 URL] - 请查看第一条评论中的屏幕截图以查看正在发生的错误。

检查那个网站。出于某种原因,有时在加载登录页面时,我会在登录框后面看到一条深色条纹(这只显示在 Chrome 和 Safari 中)。如果您没有看到它,请尝试 Shift + Refresh 几次。在表单内的任意位置单击或尝试检查元素似乎会删除这个黑框(通常,并非总是如此)。我认为这是因为我在尝试登录时在页面上显示了一个叠加层。但是,覆盖设置为显示:无,因此应该看不到它。这使得页面在加载时看起来非常难看,所以如果我可以删除它会很棒。任何帮助是极大的赞赏!

4

2 回答 2

3

所以我复制了你的 CSS 和 HTML 并制作了一个本地版本来解决这个问题。

这是我为解决您的问题所做的。

答:我在您的身体标签上设置了 100% 的明确高度(以防止任何裁剪或内容)

B:您的 Section 元素的页边距顶部正在被您的 Body 元素合并或继承(不太确定该术语是什么)。所以我设置了 margin-top:0; 在您的 section.login-form 上并将其设置为“padding-top:45px;” 直接在身体上。

总之这是我使用的CSS

    body {
      background: url("login-bg.jpg") repeat-x scroll center top #2b87ae;
      color: #5c5e5e;
      font-family: 'OpenSansBold', sans-serif;
      height: 100%;
      padding-top: 45px;
    }

    body section.login-box {
      margin: 0 auto;
    }

我没有包括你所有的 .login-box CSS,但相关的行是 210。

让我知道这对你有用。

于 2012-05-15T01:27:20.083 回答
0

我拆除了网站并隔离了问题:

<!doctype html>
<html>
    <head>
    <style>
      @-webkit-keyframes spin {
        100% { -webkit-transform:rotate(100deg); }
      } 

      body {
        background-image: url("login-bg.jpg");
      }

      div {
        z-index: -1;
        position: absolute;
        -webkit-animation: spin 0.7s linear infinite; 
      }

      </style>
    </head>
    <body>
      <div></div>
    </body>
</html>

在您的页面中,动画将应用于 div class="loading dead-center"。我最好的建议是尝试使用display: none;而不是z-index: -1;隐藏动画。

于 2012-05-15T02:17:24.610 回答