Внутри div не привязывается к вершине контейнера div

Question

Прежде чем вы прочитаете, я использую плагин OneByOne JQuery Slider, содержимое плагина - это то, что я пытаюсь привязать к вершине своего контейнера div. Чтобы узнать больше о OneByOne, вот ссылка: http://codecanyon.net/item/jquery-onebyone-slider-plugin/684613

Я пытаюсь сделать снимок внутри DIV в верхней части его контейнера 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 является «содержимым», но с плагином OneByOne он распознается как один блок divBeOne, закодированный выше, вот моя соответствующая 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; 
}