Google Chrome瀏覽器上的多個渲染問題

Question

我遇到一個奇怪的問題，即網頁上的某些元素呈現兩次，並且似乎僅限於使用Chrome。

上下滾動頁面時似乎會出現此問題，並導致顯示該元素，但隨后在其上方直接重復了一半的內容。 它發生在涉及多個不同部分的多個頁面上，因此很難縮小到一件事。 起初我以為這是一個JS問題，但是刪除了所有腳本后，它仍然在發生。 下面的代碼只是該部分不斷發生的一個示例：

<div class="service-holder">
     <div class="service-image">
          <a class="image-link" href="#"><img src="image-here" alt=""/></a>
      </div>
      <div class="service-text">
           <h2><a href="#">Short Title</a></h2>
           <a class="arrow-link" href="#" title="">Link Here</a>
           <a class="mobile-link" href="#"></a>
      </div>
</div>

此塊重復3次，基本上只是一個帶有圖像，標題和幾個鏈接的塊。 它的CSS是：

.service-holder {
    position: relative;
    padding: 0;
    margin-bottom: rem-calc(30);
    .service-image {
        .image-link {
            display: block;
        }
        img {
            width: 100%;
        }
    }
    .service-text {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        background: rgba(0,0,0,0.65);
        padding: rem-calc(20);
        h2 {
            margin-bottom: 0;
            a {
                font-size: rem-calc(42);
                color: #fff;
                font-style: italic;
                font-weight: 600;
                text-transform: uppercase;
                letter-spacing: -0.005rem;
                line-height: rem-calc(30);
            }
        }
        .arrow-link {
            color: #fff;
            font-weight: 600;
            line-height: rem-calc(30);
            letter-spacing: 0.2rem;
            text-transform: uppercase;
            &:focus,
            &:hover {

            }
        }
        .mobile-link {
            display: block;
            position: absolute;
            left: 0;
            right: 0;
            top: 0;
            bottom: 0;
            z-index: 9999;
        }
    }
}

關於可能導致此問題的任何想法都將有所幫助！ 正如我所說的，它發生在完全不同的部分的多個不同頁面上，因此我不確定所有樣式實際上是否始終存在。

Answer 1

正確，我發現了導致Chrome渲染問題的問題，盡管它實際上與我在問題中發布的代碼無關-但是該解決方案可能會幫助遇到相同問題的任何人。

為了將頁腳強制到頁面底部，每個頁面上的主要內容區域具有以下內容：

 height: 100%;
 overflow-y: auto;

刪除這些可解決問題。