Почему overflow:auto не работает должным образом?CSS

Разбираемся в CSS
Ответить Пред. темаСлед. тема
Anonymous
 Почему overflow:auto не работает должным образом?

Сообщение Anonymous »


У меня есть HTML-код, в котором я не могу понять, как указать элементу .modal-message, чтобы он не превышал родительский элемент div .modal-container. Родительский элемент имеет динамический набор высоты (80%), и мне каким-то образом нужно заставить его дочернего элемента вписаться в него. Я не хочу добавлять overflow: auto к родительскому элементу, я хочу, чтобы дочерний элемент можно было прокручивать.

.content { ширина: 600 пикселей; маржа: 0 авто; фон: #ддд; } .wrapper { отступ: 1рем; положение: относительное; } .модальный { дисплей: гибкий; позиция: абсолютная; верх: 0; слева: 0; ширина: 100%; высота: 100%; выровнять-элементы: по центру; оправдание-содержание: центр; } .modal-контейнер { максимальная ширина: 80%; максимальная высота: 80%; /* переполнение: авто; */ /* этого я не хочу делать */ } .modal-header { заполнение: .1rem 1rem; фон: #ccc; } .modal-сообщение { /* максимальная высота: 150 пикселей; */ /* этого я не могу сделать */ отступ: 1рем; фон: #f1f1f1; переполнение: авто; Документ Lorem ipsum dolor sit amet, consectetur adipisicing elit. Itaque perferendis aut dolores quia soluta sequi eos, ad reiciendis ex modi voluptate dolore officiis sint est Laboriosam Aperiam Exercitationem ipsam consequuntur.

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Itaque perferendis aut dolores quia soluta sequi eos, ad reiciendis ex modi voluptate dolore officiis sint est Laboriosam Aperiam Exercitationem ipsam consequuntur.

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Itaque perferendis aut dolores quia soluta sequi eos, ad reiciendis ex modi voluptate dolore officiis sint est Laboriosam Aperiam Exercitationem ipsam consequuntur.
Очень важный заголовок
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Itaque perferendis aut dolores quia soluta sequi eos, ad reiciendis ex modi voluptate dolore officiis sint est Laboriosam Aperiam Exercitationem ipsam consequuntur.

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Itaque perferendis aut dolores quia soluta sequi eos, ad reiciendis ex modi voluptate dolore officiis sint est Laboriosam Aperiam Exercitationem ipsam consequuntur.

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Itaque perferendis aut dolores quia soluta sequi eos, ad reiciendis ex modi voluptate dolore officiis sint est Laboriosam Aperiam Exercitationem ipsam consequuntur.

Кто-нибудь знает, как этого добиться?
Реклама
Ответить Пред. темаСлед. тема

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

  • Похожие темы
    Ответы
    Просмотры
    Последнее сообщение

Вернуться в «CSS»