Задание следующее:
1. Сверстать попап
take.ms/kf1Rh
Пояснение:
- попапом является красный прямоугольник
take.ms/JPbnz (остальное - часть страницы)
- лайаут страницы занимает 100% высоты окна браузера (изменяется высота только белой части - на видео это видно)
Требования к попапу:
- лежит в боди
- ширина фиксированная
- top, left фиксированы
- высота попапа переменная (смотри видео)
- если контента много, он скролится как показано на видео (скрол можно оставить стандартный)
- если контента мало, высота попапа уменьшается пропорционально содержимому, скрола нет
- высота заголовка переменная, зависит от количества текста
- использовать js нельзя (только css)
- кроссбраузерность не нужна, достаточно чтобы работало в хроме
- контент повторять нет необходимости, можно вставить любой текст
- открытие попапа делать не нужно, сразу находится в ДОМе (как на видео)
- все цвета и размеры можно взять произвольные
Вот моя реализация, но по заданию между нижним краем попапа и нижним краем вьюпорта должен быть фиксированный отступ , а у меня при уменьшении высоты вьюпорта он срезается .
Как это реализовать или в какую сторону хотя бы копать ?
Простой
