[CSS] Menu

[Kartofelek]

Dziedziczenie =/= dziedziczenie

Przyklad:

Kod:

<div class="xxx">
     <div class="ppp">
          <div>
               <a href="">
                    <div>....</div>
               </a>
          </div>
     </div>
</div>

Teraz jeżeli napiszesz

Kod:

.xxx div {...}

to to stylowanie bedzie sie odnosilo do wszystkich div wewnątrz .xxx (czyli nawet do tego w linku A).
To jest to twoje dziedziczenie, a tak naprawdę to styl lapie wszystkie elementy. U ciebie są to LI.

Teraz jeżeli chcesz ostylować tylko dzieci danego węzła to napiszesz:

Kod:

.xxx > div {...}

Powyższy styl odnosić się będzie tylko do diva .ppp bo tylko on jest dzieckiem dla .xxx (czyli lezy bezposrednio w danym wezle)

Teraz przekładając to na twój przykład.

Kod:

.menu li {.....} <--- styluję wszystkie li (nawet dla podmenu, bo przecież są glebiej danego wezla)
.menu .podmenu li {} <--- nadpisuje niektore wlasciwosci powyzszego stylowania (zapewne float:left dla elementow podmenu nie bedzie pasowalo)

mozna tez tak:

Kod:

.menu > li {....} <---- styluje tylko glowne menu (bez .podmenu)
.menu .podmenu li {....} <------- nic nie musze nadpisywac, styluje od poczatku podmenu

Która metoda jest lepsza?
To zalezy od layouty. Jeżeli podmenu są bardzo podobne do glownego menu, wtedy v1 jest lepsza. Jezeli znacznie się różnią wyglądem, wtedy v2