HTML - текст выходит за рамки div'a

Question

HTML - текст выходит за рамки div'a

EvilCube Профи (639), закрыт 5 лет назад

Не кидайтесь тапками, пожалуйста)
Есть HTML код (стили к нему тоже прикрепил), он на первой картинке.
Там много надписей "b", каждая является параграфом и начинается с новой строки. Все они находится в диве "messageDiv". Когда надписи доходят до дна, то выходят за его рамки. Что нужно дописать/изменить, чтобы такого не было?

Дополнен 5 лет назад

Надо, в общем, чтоб messageDiv скроллился, если параграфы не входят

Answer 1

Leo Khan Гуру (3827) 5 лет назад

#messageDiv {
overflow: auto;
}

EvilCubeПрофи (639) 5 лет назад

Спасибо!

Юрий КраузеГуру (2730) 5 лет назад

Это правильно

Answer 2

Liru Искусственный Интеллект (116016) 5 лет назад

А зачем вам вообще вложенные дивы, да еще и с разными ид ?

EvilCubeПрофи (639) 5 лет назад

А это имеет смысл в данной ситуации? Пишу чат ради прикола, эти дивы и надписи с них он из БД берёт

EvilCubeПрофи (639) 5 лет назад

Разве тут дивы "div_*число*" не нужны?

Liru Искусственный Интеллект (116016) Если ты эти дивы по их id ниоткуда не вызываешь - нет, не нужны.

Answer 3

vopros dnya Гуру (3364) 5 лет назад

height: auto;

в messageDiv

EvilCubeПрофи (639) 5 лет назад

Изменил правило height на auto в #messageDiv, теперь вот такое, writeDiv вообще пропал, скролл не добавился, сообщения всё-равно снизу. Как сделать так, чтоб размер writeDiv остался, но можно было его листать?

EvilCube Профи (639) чтоб messageDiv остался*

Answer 4

` ` Мыслитель (9231) 5 лет назад

Моленькие тёмные картинки

Answer 5

Надо ограничить пространство блока overflow:hidden и поставить overflow-y:auto; но всё это работает при ограниченной высоте блока

Answer 6

Если не можешь делать, найди готовое решение и посмотри как другие делают и всё,будешь знать в следующий раз

Answer 7

nowhere man Мудрец (16105) 5 лет назад

Классика.

Answer 8

#messageDiv,
#messageDiv > p { width: 100%; }

#messageDiv {
min-height: 200px; max-height: 500px;
overflow-y: auto; }

Answer 9

Привет! Хочешь быстро научиться писать сайты? Заходи к нам на [ссылка заблокирована по решению администрации проекта]. Здесь, в интерактивной форме, ты научишься писать сайты любой сложности. Ах да, еще у нас есть “ачивки” и много чего вкусного. Присоединяйся!