Как разместить первый элемент группы по центру при любом разрешении?

Question

[Дима]

Есть скролл-слайдер и нужно чтобы первый элемент всегда был по центру экрана, а остальные элементы не были видны, пока не начнешь делать боковой скролл. И чтобы этот элемент был по центру при любом разрешении. Какими средствами CSS это можно реализовать?
Сейчас так

А надо вот так

Comments

[YavaDev]

60% - ширина блока
100% - 60% = 40% - остаток
40% / 2 = 20% - отступ

div:first-child {
	margin-left: 20%;
}

Answer 1

[Фёдор]

Как вариант сделать через Flex-ы.

Comments

[Дима]

можно чуточку подсказать конкретней?) через какое их свойство?

[Фёдор]

Посмотрите в сторону таких свойств как inline-flex, а так же grow, shrink и сокращённое свойство flex

[Дима]

Фёдор, они ж все работают с шириной элемента в сетке, а не с позиционированием его на странице. Ширина одинаковая у всех элементов должна быть.

Answer 2

[Deniel]

overflow: hidden;