Как убрать двойной скрол и пустое место из-за длины абс. спозиционированного меню?

Question

[parnasmi]

Всем привет!
На данном странице из-за абсолютно спозиционированных блоков(выпадаюшее меню при наведении на пунктов меню) меню у слева наверху появляется пустое место снизу. Из-за этого появляется пустое место снизу и двойной скролл. Двойной скролл можно убрать если у html убрать правило overflow-x:hidden; Но, вот никак не пойму причину, почему абс. позиционированные блоки порождают отступ снизу? Ведь они же не в потоке?
Надеюсь кто-нибудь объяснить мне почему так происходит. Заранее спасибо.

Answer 1

[Андрей]

Пройдите в меню:
Лампы -> Красота и здоровье
Что Вы видите?) Правильно, нереально большой список итемов, из-за которых и все проблемы.
Очень рекомендую добавить максимальную высоту списков с overflow: auto;
Иначе, даже выбитому из потока парню надо куда-то вмещаться, чтобы его юзверь-то увидел

Answer 2

[Сергей delphinpro]

почему абс. позиционированные блоки порождают отступ снизу? Ведь они же не в потоке?
Надеюсь кто-нибудь объяснить мне почему так происходит.

А куда же им деться?
Причина очевидна — блок растягивает страницу настолько, чтобы вместиться в неё. И неважно, абсолютный он, или нет.

Ведь они же не в потоке?

Ну и что? Ну вынули элемент из потока, со страницы-то он никуда не делся.

---
Простое решение:
дать выпадашкам position:fixed а при ховере - absolute
Побочный эффект — скролл страницы будет проявляться только при открытом меню, если оно не вместится.
Еще простое решение (частный случай):
Для последнего уровня задать максимальную высоту и oveflow:auto
Минусы — годится только для последнего уровня, потому что его границы уже ничего не вылезет из-за overflow

Все остальные решения требуют вмешательства javascript или серьёзной переработки принципа показа подменюшек.