Inside div不會捕捉到容器div的頂部

Question

在您進一步閱讀之前，我正在使用OneByOne Jquery Slider插件，插件內容是我試圖捕捉到它的容器div的頂部。要了解更多關於OneByOne，這裏是一個鏈接：http://codecanyon.net/item/jquery-onebyone-slider-plugin/684613

我試圖捕捉內部格到其div容器的頂部，這裏是我的（我認爲是這樣），相關的CSS：

#banner{ 
    position: absolute; 
}  

.oneByOne1{ 
    margin-right: auto; 
    margin-left: auto; 
    width: 960px; 
    height: 420px;  
    position: relative; 
    overflow: hidden; 
} 

#banner .oneByOne_item{ 
    position: absolute; 
    width: 960px; 
    height: 420px; 
    overflow: hidden; 
    display: none; 
} 

我試圖捕捉到頂部的DIV是「旗幟」 DIV，容器DIV是「內容」，但與oneByOne插件，它是公認的oneByOne DIV塊以上的編碼，這裏是我的相關HTML：

<div id="content"> 
    <div id="banner"> 
     <div class="oneByOne_item"> 
      <img src="img/storefront.jpg" class="item_1_1" />    
     </div> 
     <div class="oneByOne_item">          
      <img src="img/livemusic.jpg" class="item_1_2" /> 
     </div> 
     <div class="oneByOne_item">          
      <img src="img/brokerecord.jpg" class="item_1_3" /> 
     </div> 
    </div> 
</div> 

這是我現在的網站的鏈接： http://raider.grcc.edu/~ryanduffing/recordstore/

Answer 1

<div class="search_line">具有position:relative和top: -100px。裏面的圖像高度爲61px，因此它周圍的div也是如此。

由於您將它定位得相對比較起來，它仍然佔用了DOM自然會出現的空間，但是您的top值將其「拉」到視覺上的顯示位置。因爲它仍然佔用DOM中的空間，所以它會將你的#content降低到61px。

我看不到一個很好的理由要離開它你是怎麼做到的，所以如果你可以改變它沒有別的什麼突破，我建議將其更改爲

.main_header .search_line { 
    position: absolute; 
    top: 39px; 
    right: 0; 
}