Как сделать липкий div на родительском свитке

Question

Я пытаюсь сделать div липким, когда он покидает экран.

я нашел этот пример

https://codepen.io/geddski/pen/rjYpVr

<sidescroller>
...
</sidescroller>

Но в моем случае я прокручиваю его родительский контейнер.

Мой случай:

https://codepen.io/anon/pen/QzNWad

<div class="test">
<sidescroller>
...
</sidescroller>
</div>

Можно ли заставить работать мое дело?

Спасибо

Answer 1

добавив width: 100vw; и position: fixed; к вашему sidescroller, добьемся цели:

sidescroller{
  display: flex;
  align-items: center;
  overflow-x: auto;
  overflow-y: hidden;
  background: #000;
  width: 100vw;
  position: fixed;
}

Рабочая кодовая ручка