Q2W
@Q2W

Почему дочерний элемент от элемента с overflow:scroll имеет размер родителя, а не контента?

Есть блок, у которого css-свойство overflow выставлено в scroll. У него есть вложенный блок, в у того есть контент, который не влезает в родительский. Появляется скроллинг. Но когда этот скроллинг мы скроллим, то с удивлением обнаруживаем, что вложенный блок уезжает в бок, хотя по логике он должен продолжаться дальше.

Вот демо: jsfiddle.net/#&togetherjs=JMkxEj403B

Вот код HTML:
<div class="c">
    <div class="d">
            CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC
    </div>
 </div>

Вот код CSS:
.c {outline: solid 1px green; overflow-x:scroll; height: 35px; white-space:nowrap;}
.d {background-color:gray;}


Что делать?
  • Вопрос задан
  • 1323 просмотра
Решения вопроса 1
@iShatokhin
JS developer
Родительский у вас размером с экран, а не влазит контент, который находится во вложенном.
overflow-x:scroll; должен быть у вложенного блока, а не родительского.

Как вариант: "display: table;"
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

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

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