Gunnar Bittersmann: CSS Navigation div ausblenden und wieder anzeigen

Beitrag lesen

@@macmensa:

nuqneH

Hier nun die Endlösung im Code, als erstes das HTML:

Endlösung?

Das "Kuckuckskind" ist jedoch drin geblieben

Warum?

jedoch etwas geändert

Verschlimmbessert.

Das Problem war anscheinend nicht das <div> an sich, sondern wem ich es zugeordnet hatte. Jetzt habe ich es dem <p> zugeordnet

<li><a href="./1998.html"><div id="raum"><p>Raumfahrt</p></div></a></li>

Nein, 'a'-Elemente dürfen keine Blockelemente enthalten, also keine 'div' und auch keine 'p'.

und damit funktioniert es wie man sieht einwandfrei...

Bei fehlerhaftem Quellcode ist NIE von einwandfrein Funktionieren auszugehen. Es kann in einem Browser so aussehen wie gewünscht; heißt aber nicht, dass andere Browser die Fehler genauso korrigieren.

„Vermutlich korrigiert der IE8 Deinen Fehler anders, als es einige andere Browser tun. Das ist einer der Gründe, weshalb man am besten keine macht.“ [Cheatah]

Validiere deinen Quellcode!

Diese Zeile sollte so aussehen:
<li id="raum"><a href="./1998.html">Raumfahrt</a></li>

Und wenn die 'a'-Elemente die ganze 'li'-Box ausfüllen sollen, dann setzt du eben
#navi a { display: block }

Erst wenn der Validator grünes Licht gibt (bzw. man nicht sehr genau weiß, ob das von Belang ist), sollte man sich um die Darstellung kümmern. Ansonsten:

„Bei derartig invalidem Code [...] kann man eigentlich nicht von Darstellungsfehler sprechen - eher von Darstellungswunder.“ [MudGuard]

Qapla'

--
Alle Menschen sind klug. Die einen vorher, die anderen nachher. (John Steinbeck)