@marsep

Как запретить перенос элементов в элементе с overflow-x?

Всем привет! Скорей всего суть вопроса не ясна, поэтому объясню конкретно. Нужно сверстать (html+css) следующее...
Например:
(HTML)
<div id="viewport">
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>
</div>

(CSS)
#viewport {
    overflow-x: scroll;
    width: 200px;
}
.item {
    width: 70px;
    height: 70px;
    float: left;
}


Из всего этого нужно сделать так, чтобы элементы с классом "item" шли в 1 строку, растягивая область скроллинга в #viewport, а не переносились на новую строку, растягивая сам элемент (#viewport) по высоте. Не получается сделать, также пробовал сделать с display: inline-block - результат тот же. Варианты с таблицей также не приемлемы. Заранее спасибо за возможные решения проблемы!
  • Вопрос задан
  • 4646 просмотров
Решения вопроса 1
tennalian
@tennalian
Забавно, но это работает)
jsfiddle.net/tennalian/f4y92Lnk
Разве что у инлайн-блоков отступы, но это уж ты как-нибудь сам)
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы