Как правильно настроить стили?

Question

[Иван Иванов]

Здравствуйте друзья. У меня вопрос. Есть вот такая разметка

<div class="viewport">
       <div class="element-wraper">
              
       </div>
  </div>

.viewport{
	overflow:hidden;
	width:1170px;
	height:165px;
	position:relative;
}

.element-wraper{
	position:absolute;
	max-width:10000px;
}

Подскажите как сделать, что бы element-wraper был неограниченной длины, в зависимости от кол-во элементов, но отображение этих элементов, было ограничено областью viewport. Почему-то элементы переносятся на новую строку, ограничившись размером 1170px

Comments

[Карен Мнацаканян]

ничего не понял

[Иван Иванов]

Карен Мнацаканян, что конкретно не понятно?

Answer 1

[Андрей Федоров]

Держите:
https://codepen.io/aliencash/pen/ppRqzO

Скролл только для примера, уберете сами.

Comments

[Иван Иванов]

Супер, это именно то что мне надо. Но в чем причина, что мой код не работал? (

[Андрей Федоров]

Иван Иванов, Самое главное - перенос строки в обертке надо запретить.

[Иван Иванов]

Андрей Федоров, Спасибо большое ))) А еще один вопрос, быть может вы знаете, как нибудь можно привязаться к полосе прокрутки, либо стилизовать её как-то? Буду благодарен за ссылки по этой тематике

[Андрей Федоров]

Иван Иванов, Недавно читал статью на эту тему, но не сохранил ссылку, т.к. низкая поддержка браузерами у предлагаемого решения. Погуглите про scroll-behavior и scroll-snap

Answer 2

[Антон Спирин]

Вы наверное слайдер делаете. Можно так https://jsfiddle.net/rockon404/qw6ty8rs/