Изменение вертикальной прокрутки до горизонтальной прокрутки?

Question

Прошу прощения за ужасный титул.

У меня проблема. У меня есть пара элементов, по названию они:

-page 
-graph-container 
    -lots of elements 
-selector 

Элемента графа-контейнер и селектор должна быть инлайн рядом друг с другом с помощью переключателя плавающего вправо. Элемент graph-container должен иметь много элементов, расположенных рядом друг с другом (в одной строке), тем самым создавая полосу прокрутки в координате x.

Для жизни меня я не могу заставить это работать. Текущий CSS выглядит следующим образом:

-page - width: 820 (applies correctly) 
-container - height: 500px; width: 620; display: inline-block; overflow: scroll; 
    -lots of elements - display:inline; 
-selector - float:right; display:inline-block; 

То, что это заставляет меня это вертикальная полоса прокрутки с элементами оберточной вокруг конца на следующую строку. Мне бы хотелось, чтобы все элементы находились в одной строке, а свиток - влево и вправо/в горизонтальном направлении.

Answer 1

Ну, я понял, и это может быть полезно для любого пользователя Google. Попробуйте добавить

white-space: nowrap; 
overflow-x:scroll; 

К контейнеру.

Answer 2

idem, white-space, но вы должны распространять его там, где это необходимо, и сбрасывать там, где нет.

Другой способ, не как обычно, как пробел, - установить ширину столбца.

Он будет строить столько колонну, необходимую для посадки в высоту контейнера. (Установить ширину, иначе это одна линия :))

Для отображения 2 основных контейнеров в сторону друг друга, там плавающым , inline-block + white-space и display: обычно используется таблица/таблица-ячейка.

Предлагаемое вам множество возможностей. Тест & Отвезите тот, который лучше всего подходит вашим точкам. http://codepen.io/gcyrillus/pen/kvLzuhttp://codepen.io/gcyrillus/full/kvLzu. Не стесняйтесь развиваться и играть, ничто не сломается)