Fragen für die Einarbeitung in CSS und DIVs (Erzeugung eines Menüs)

[Schludi]

Hallo liebe HTML-Community.

ich versuche mich gerade in die DIV-Thematik einzuarbeiten und schaue mir gerade ein Tutorial zur Erzeugung eines Menüs an, das scheinbar rein auf CSS+Divs basiert (kein Javascript).

Janko At Warp Speed | Create Vimeo-like top navigation

Ich habe dieses Tutorial ausprobiert und frage mich nun wie die folgenden Sachen zu Stande kommen:

1.) Wieso öffnet sich ein Menü (ohne irgendwelche onMouseOver-Ereignisse) wenn man mit der Maus über den HELP-link geht?
2.) Eine Liste UL/LI ist doch normalerweise untereinander mit Punkten angeordnet. Was bewirkt diese Ausrichtung hier nebeneinander?
3.) Würde ein weiterer Content unterhalbt des Menüs beeinträchtigt werden, wenn dieses Menü aufklappt?

Mein Ziel ist es ein Menü wie im Banner von www.klima-sucht-schutz.de zu erzeugen. Habe daher dieses Tutorial als Grundlage gewählt.

Viele Grüße
Schludi

 

[Wustersoss]

Hallo,

und willkommen im Forum.

und schaue mir gerade ein Tutorial zur Erzeugung eines Menüs an, das scheinbar rein auf CSS+Divs basiert (kein Javascript).

Sehr gut.

1.) Wieso öffnet sich ein Menü (ohne irgendwelche onMouseOver-Ereignisse) wenn man mit der Maus über den HELP-link geht?

Dafür steht im CSS:
#menu li:hover ul { display:block;}
Das Ereignis heisst hover und ist auf fast alle Elemente anwendbar.

2.) Eine Liste UL/LI ist doch normalerweise untereinander mit Punkten angeordnet. Was bewirkt diese Ausrichtung hier nebeneinander?

Im CSS steht dafür display:inline-block;
die Punkte davor nimmt weg mit list-style:none;
Beides auf das UL-Element angewendet. Der Verbleibende Platz zu den Listpunkten wurde mit margin-right erreicht. Ein setzen von margin-right:0; nimmt auch diesen rechten Abstand zurück.

3.) Würde ein weiterer Content unterhalbt des Menüs beeinträchtigt werden, wenn dieses Menü aufklappt?

Nein. Der Grund liegt im position:relative; bei den Listenpunkten.

viel Erfolg.

 

[Schludi]

Hallo Wustersoss!

Vielen Dank für Deine Erklärung!

Habe jetzt schon ein anfängliches Ergebnis erzielen können:

http://www.capri-soft.de/rommel/index.html

Mein Problem war noch, das ich die Ecken des Menüs im Banner mit onmouseover onmouseout einblende. Hierfür suche ich noch eine elegante CSS-Lösung. Zur Not tut es auch diese einfache Javascript-Methode.

Jetzt hätte ich noch eine Frage:
Wie schaffe ich es einen Footer fixer Größe zu erzeugen, der immer bis an den unteren Seitenrand runtergeht. Auf der Seite ist es momentan so, das er sich leider nicht ganz durchzieht.

Hoffe ich erlange hierdurch einige tiegergehende Kenntnisse :-).

Viele Grüße
Schludi