div выше другого div, но должен прокручиваться под последним
Eстьdiv
(а именноdiv_fixed
) который фиксируется в положении. Другаяdiv
а именноother_content
нижеdiv_fixed
,other_content
div имеетpadding-top
свойство, так что при прокрутке страницы толькоother_content
прокручивается под фиксированным делением
Скрипка естьВот
HTML:
FIXED
content goes here<br>
content goes here<br>
content goes here<br>
CSS:
div { color: #fff }
.div_fixed { position: fixed;
width: 100%;
height: 100px;
}
.other_content {
background: #f00;
height: 5000px;
color: #fff;
padding-top: 100px;
margin:0 auto;
}
Но я хочу, чтобы нефиксированный div оставался на фиксированном div и хотел, чтобы нефиксированный div исчезал прямо под его верхним краем, то есть положение нефиксированного div 'верхний край останется фиксированным, но этоСодержание прокручивается при прокрутке страницы так же, как это происходило, когда оно оставалось ниже фиксированного div.
Так что у меня было небольшое редактирование в html (всего 2 перерыва) перед нефиксированным div:
FIXED
<br><br>
content goes here<br>
content goes here<br>
content goes here<br>
Дополнение в CSS это:
.fixed_div{
z-index:-1;
}
.other_content{
width:60%;
z-index:99099900;
}
Но верхний край нефиксированного элемента div не остается в той позиции, которую я хочу.
Как этого добиться?
РЕДАКТИРОВАТЬ :
Предположим, я добавляю фоновое изображение для нефиксированногоdiv
, Возможно ли, что часть фонового изображения исправленаdiv
над которым будет прокручиваться другой divz-index
выше, чем у нефиксированногоdiv
? Будет ли проблема решена таким образом?
EDIT2
Давайте использовать предположим, чтоfixed_div
это заголовок,other_content
этосодержание тела веб-страницы. Давайте добавим нижний колонтитулdiv
с идентификаторомfooter
, Никакой свиток не должен присутствовать в.other_content
other_content
следует прокручивать при прокрутке страницы.