Flex-контейнер странным образом размещает внутренние элементы ⇐ CSS

[Anonymous]

Я пытаюсь сделать слайдер на всю ширину страницы. Я пытаюсь использовать гибкие блоки.

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

.sliderContainer {
width: 100%;
display: flex;
align-items: flex-start;
position: relative;
overflow: hidden;
}

.sliderItem {
width: 100vw;
position: relative;
flex-shrink: 0;
}

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

element

element

В пользовательском интерфейсе это выглядит примерно так:
как это есть показано
Более того, если я изменю значение overhidden на auto, горизонтальная полоса прокрутки будет не слева, а где-то посередине. вот изображение: введите сюда описание изображения
Как его правильно разместить?
Я ожидаю слайдер размером во всю ширину страницы . Но теперь у меня возникли некоторые проблемы с размещением этих элементов div и присвоением им соответствующих значений свойств CSS.
Я старался не использовать флексы, пытался прокручивать их вручную и многое другое. подробнее

Подробнее здесь: https://stackoverflow.com/questions/783 ... r-elements