Почему не работает position: sticky 2.0?

Question

[Владислав]

Добрый день.
Сабж. Bootstrap 3.

<div class="col-xs-12" style="height: 3500px; background: gray;">
	 <div class="sticky">
<!--some content-->
        </div>
</div>

.sticky {
    position: sticky !important;
    position: -webkit-sticky;
    top: 0;
    min-height: 2em;
}

Высота блока sticky больше высоты экрана, но меньше высоты родителя (меньше 3500px).
...и это не работает.
Я использую этот класс уже давно, но вот на одном сайте залип и вообще не понимаю, что не так. Может бустраповский класс col-** мешает...

Comments

[Евгений]

Если у родителей и вверху по дому есть overflow: hidden, то работать не будет

[Владислав]

У body был overflow-x: hidden. Я его убрал, но не помогло.

[FeST1VaL]

Владислав, Сделайте песочницу, может пока ее делаете разберетесь))) Просто гадать такое себе занятие...

Answer 1

[Serj-One]

sticky - это прокрутка страницы без прокрутки элемента. Если у тебя обёртка col-xs-12, относительно чего фиксироваться sticky элементу? Скролящегося блока рядом нет. Не уверен, но учитывая механику, попробуй сделать обёртку col-xs-11 и добавь рядом col-xs-1 большей высоты.