Witam!

Chciałem stworzyć prototyp wielopoziomowego menu, tak żeby bez zbędnej roboty móc je skopiować do nowych projektów. Problem z tym co już napisałem jest taki, że każdy z poziomów trzeba chować osobno, co daje po 2 reguły dla każdego poziomu.
Czy da się to tak napisać te reguły, aby działały dla nieskończenie wielu poziomów? Taki mały szczególik, ale chciałbym, żeby to było maksymalnie uniwersalne.

[HTML] pobierz, plaintext 
/* DROPDOWN MENU */
 
.dropdown-menu li{
    float: left;
    position: relative;
}
/* 2 level */
.dropdown-menu li ul{
    display: none;
    position: absolute;
    top: 30px; /* wysokosc 1 poziomu */
    left: 0px;
}
.dropdown-menu li ul li{
    float: none;
}
.dropdown-menu li ul li ul{
    left: 120px; /* szerokosc 2+*/
    top: 0;
}
/* pokazywanie i chowanie odpowiednich poziomów */
.dropdown-menu li:hover ul {
    display: block;
}
.dropdown-menu li:hover ul li ul{
    display: none;
}
.dropdown-menu li ul li:hover ul{
    display: block;
}
.dropdown-menu li ul li:hover ul li ul{
    display: none;
}
.dropdown-menu li ul li ul li:hover ul{
    display: block;
}
.dropdown-menu li ul li ul li:hover ul li ul{
    display: none;
}
/* DROPDOWN MENU - end*/
 
 
/* wygląd menu*/
#nav{
    width: 950px;
    height: 30px;
    margin: 0 auto;
    background: #ccc;
}
#nav ul li{
    line-height: 30px;
    height: 30px;
}
#nav ul ul{
    background: #bbb;
}
#nav ul ul ul{
    background: #aaa;
}
#nav ul ul ul ul{
    background: #999;
}
#nav ul li ul li{
    width: 120px;  
}
[HTML] pobierz, plaintext 

da się, nie ma rzeczy niemożliwych
pokaż livedemo i html do tego to coś się wymyśli

Demo: http://s339854745.domenastandartowa.pl/kom..._down_menu.html

w HTMLu nie ma nic szczególnego:

[HTML] pobierz, plaintext 
<div id="nav"><ul class="dropdown-menu">
                <li><a href="#">Menu 1</a>
                    <ul>
                        <li><a href="#">Menu item 1-1</a></li>
                        <li><a href="#">Menu item 1-2</a></li>
                        <li><a href="#">Menu item 1-3</a></li>
                    </ul>
                </li>
 
                <li>Menu 2
                    <ul>
                        <li><a href="#">Menu item 2-1</a></li>
                        <li>
                            <a href="#">Menu item 2-2</a>
                            <ul>
                                <li><a href="#">Menu item 2-2-1</a></li>
                                <li>
                                    <a href="#">Menu item 2-2-2</a>
                                    <ul>
                                        <li><a href="#">Menu item 2-2-2-1</a></li>
                                        <li><a href="#">Menu item 2-2-2-2</a></li>
                                        <li><a href="#">Menu item 2-2-2-3</a></li>
                                    </ul>
                                </li>
                                <li><a href="#">Menu item 2-2-3</a></li>
                            </ul>
                        </li>
                        <li><a href="#">Menu item 2-3</a></li>
                    </ul>
                </li>
                <li><a href="#">Menu 3</a>
                    <ul>
                        <li><a href="#">Menu item 3-1</a></li>
                        <li><a href="#">Menu item 3-2</a></li>
                        <li><a href="#">Menu item 3-3</a></li>
                    </ul>
                </li>
            </ul>
 
        </div>
[HTML] pobierz, plaintext 

wskazówka dla Ciebie:

[CSS] pobierz, plaintext 
.dropdown-menu li > ul{
display: none;
position: absolute;
top: 30px;
}
.dropdown-menu li:hover > ul {
display: block;
}
[CSS] pobierz, plaintext 

Nie w tym tkwi problem. Tylko w 3, 4, 5... poziomie. Jak zaoszczędzić na ostatnich liniach cssa?

Poza tym. IE 6,7 nie obsługuje bezpośredniego dziedziczenia '>' . Sprawdzałem ten kod pod IE 7 i pod IE 6 po dodaniu lihover.htc i działa dobrze.

dla starych i bezużytecznych przeglądarek polecam http://code.google.com/p/ie7-js/ - bez nowych rozwiązań pozostaje Ci zabawa w ręczne zagnieżdżanie każdego poziomu (bo to co ja Ci wkleiłem pozwala na automatyczne wyświetlanie jednego po drugim bez konieczności definiowania osobnego elementu dla każdego poziomu)

Teraz rozumiem twój zamysł.
Moje podejście było inne.
Chciałem po najechaniu na LI pokazać wszystkie listy w nim zawarte, a potem schować wszystkie listy poziom niżej, ale ta technika zawiodła