在調整大小時，div高於另一個

Question

這可能是一個簡單的解決方法，但我似乎無法弄清楚什麼是錯的。我刪除了沒有必要的所有內容，希望代碼不會太難讀取。

基本上，當您向下縮放頁面時，寬度方向上，頁腳（聯繫人）與其上方的div重疊。在Code Pen上它已經重疊。

HTML：

<div class="library library-row specialties"> 
     <div class="container"> 
      <div class="desc"> 
       <h1>Our Specialties<br/></h3> 
       <p> 
        Everything we can do for you 
       </p> 
      </div> 
      <div class="row row-images"> 
       <div class="col-sm-4"> 
        <i class="fa fa-database" aria-hidden="true"></i> 
        <h4>Databases</h4> 
       </div> 
       <div class="col-sm-4"> 
        <i class="fa fa-server" aria-hidden="true"></i> 
        <h4>Servers</h4> 
       </div> 
       <div class="col-sm-4"> 
        <i class="fa fa-cloud" aria-hidden="true"></i> 
        <h4>Cloud Integration</h4> 
       </div> 
      </div> 
     </div> 
    </div> 

    <div class="footer library library-row"> 
     <div class="container"> 
      <div class="accounts"> 
       <i> 
        <a href="#" class="fa alt fa-facebook"></a> 
        <a href="#" class="fa alt fa-twitter"></a> 
        <a href="#" class="fa alt fa-instagram"></a> 
        <a href="#" class="fa alt fa-github"></a> 
        <a href="#" class="fa alt fa-envelope"></a> 
       </i> 
      </div> 
     </div> 
    </div> 

CSS：（我無法在粘貼，抱歉，但請從典筆明白）

典筆：Click Here

再次，抱歉如果這是一個基本的修復。我試過了，但我不確定它有什麼問題。

Answer 1

有一些CSS被應用於.specialties，它正在修復該div的高度。頁腳放置在div下方，但.specialties div中的內容在div外部垂直溢出，因此內容在頁腳下方和下方呈現。

刪除此高度：100vh; CSS，你可以看到爲什麼會發生這種情況。可能需要重構，如果你能解釋設計意圖，我很樂意提供幫助。

.specialties { 
    height: 100vh; 
}