Div на верхней части слайдера

Question

Привет, у меня есть ползунок на моей веб-странице, и я хочу разместить небольшую коробку на верхней части этого слайдера. Как я могу достичь этого с помощью позиционирования css?

<div id="slider"></div> 
<div id="captionBox"></div> 

Answer 1

HTML

<div class="container"> 
    <div id="slider"></div> 
    <div id="captionBox"></div> 
</div> 

CSS

.container {position:relative} 
#captionBox {position:absolute;top:0;left:0} 

Вы можете изменить сверху и слева значений точек также 10px например. Вы также можете применить правила г-индекс CSS для наслоения эффектов

объяснение

Абсолютный позиционируемый элемент позиционирован со смещением на границе ближайшего восходящим, который имеет относительное позиционирование. Абсолютный позиционный элемент игнорируется в потоке HTML-документа, поэтому вы не можете его плавать