[css] navigacja, nachodzące warstwy

[Pedro84]

@pedro84: jeżeli masz jakiś ciekawy koncept to podziel się nim, chętnie dowiem się czy można to zrobić lepiej

Ogólnie mówiąc, charakterystyką dobrego kodu (niezależnie od języka) jest unikanie zbędnych rzeczy oraz niepowtarzanie się (DRY).

Tworząc takiego potworka:

Kod:

<div id="navigation">
    <ul>
         <li>Link</li>
         <li>Link</li>
    </ul>
</div>

stosujesz zupełnie niepotrzebny element - div. Zamiast tego, najlepiej jest nadać klasę elementowi listy i wtedy stylować. W momencie gdy potrzebujesz umieścić kilka takich samych elementów na stronie, po prostu stylujesz każdą z osobna (jeśli się różnią), np.

Kod:

.header .navigation, .footer .navigation { //tutaj css taki sam dla obu elementów }
.header .navigation { //tutaj css }
.footer .navigation { //tutaj css }

Tworzysz dzięki temu elastyczny kod, który możesz łatwo rozbudowywać.