Позиция: липкий не работает после некоторого количества свитка ⇐ Html

[Anonymous]

Я пытаюсь создать макет, где 1 -е и последнее столбцы в div липкие. Когда я прокручиваю некоторую сумму, левая большая часть столбца выходит за пределы левого предела. Почему это может происходить и как это исправить? />

Код: Выделить всё

.slider {
width: 100%;
position: relative;
overflow: auto;
}

.header,
.body {
display: flex;
}

.item {
width: 20%;
height: 100px;
background: yellow;
border: 1px solid black;

flex-grow: 0;
flex-shrink: 0;
}

.sticky-item-left {
position: sticky;
left: 0;
background: red;
}

.sticky-item-right {
position: sticky;
right: 0;
background: green;
}< /code>

Подробнее здесь: https://stackoverflow.com/questions/730 ... -of-scroll