Многоуровневое горизонтальное меню

[ukalen]

Добрый день, интересует вопрос, как из такой стандартной стр-ры

<style>
.menu-h-d { min-height: 24px; border-left: 1px solid #ccc; }
.menu-h-d li { float: left; display: block; position: relative; border: 1px solid #ccc; border-width: 1px 1px 1px 0px; list-style: none; }
.menu-h-d a { text-decoration: none; padding: 2px 10px; display: block; }

.menu-h-d ul { display: none; position: absolute; top: 22px; left: -1px; width: 160px; background: #fff; border: 0; border-bottom: 1px solid #ccc; }
.menu-h-d ul ul { left: 100%; top: -1px; }

.menu-h-d li li { float: none; border-width: 1px 1px 0px 1px; }

.menu-h-d li:hover { background: #ccc; }
.menu-h-d a:hover { color: #fff; }

.menu-h-d li:hover ul,
.menu-h-d li:hover ul li:hover ul,
.menu-h-d li:hover ul li:hover ul li:hover ul { display: block; }

.menu-h-d li:hover ul ul,
.menu-h-d li:hover ul li:hover ul ul { display: none; }

</style>
<ul id="menu" class="menu-h-d">
        <li><a href="#">Горизонтальное</a>
                <ul>
                        <li><a href="#">подменю 1</a>
                          <ul>
                            <li><a href="#">подменю 1.1</a></li>
                            <li><a href="#">подменю 1.2</a></li>
                            <li><a href="#">подменю 1.3</a></li>
                          </ul>
                        </li>
                        <li><a href="#">подменю 2</a></li>
                </ul>
        </li>
        <li><a href="#">CSS</a></li>

        <li><a href="#">Меню</a>
                <ul>
                        <li><a href="#">Ссылка 1</a></li>
                        <li><a href="#">Ссылка 2</a></li>
                </ul>
        </li>
</ul>

сделать, что бы 3ий уровень меню, вываливался не вправо, а вниз не нарушая иерархию...то есть пункты ниже подпунктов должны быть видны. Спасибо.

[Justnewone]

не понятно что надо, можете 2 картинки привести, как есть и как надо?

[ukalen]

Есть примерно такое:

А нужно что то вроде такого:

[Justnewone]

надо избавиться от абсолюта, назначенный на элемент, он убирает оного из потока.

[ukalen]

надо избавиться от абсолюта, назначенный на элемент, он убирает оного из потока.

В таком случае не могу попасть на пункты, идущие после подпунктов.

[psywalker]

надо избавиться от абсолюта, назначенный на элемент, он убирает оного из потока.

В таком случае не могу попасть на пункты, идущие после подпунктов.

Повесь классы на нужные менюхи и рулись ими.

[Justnewone]

Не очень понимаю, почему.

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

Попробуйте интервалы сделать так, чтобы ховер элемент не прерывался при переносе мышки.

[ukalen]

Не очень понимаю, почему.

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

Попробуйте интервалы сделать так, чтобы ховер элемент не прерывался при переносе мышки.

Вроде с вашими советами все как нужно, но все равно, не могу теперь перейти на пункты идущие после подпунктов...меню прячется. Выручите новичка.

Edited April 25, 2011 by ukalen