CSS-Hover-Effekt vs. Hirarchische Auflistung

MarkusH

MarkusH

Stammgast
Hallo zusammen

Ich habe leider via Google keine wirklich Hilfe geunden und wende mich darum an euch. Ich bin fast 100% sicher, dass es irgend eine einfache Lösung gibt, da ich ja eigentlich nicht das Rad neu erfinden möchte:

Also, ich habe auf einer Webseite eine Naviagation, welche mithilfe einer Liste (<UL>) augebaut ist - beim Überfahren eines Eintrages soll dieser markiert werden (im Beispiel erscheint der Rahmen).
Allerdings soll der übergeordnete Eintrag nicht auch markiert werden.

Hier mal der Code - dann es vielleicht einfacher:

Code: 
<html><head><title>Mein CSS Problem</title>
<style type="text/css">
		<!--
		#navigation	a {text-decoration: none}
		#navigation li:hover	{text-decoration: underline; border-style: solid; }
		-->
	</style></head>

<body><ul id='navigation'>
<li><a href=''>Menu 1</a></li>
<li><a href=''>Menu 2</a></li>
<li><a href=''>Menu 3</a></li>
<li>
	<a href=''>Menu 4</a>
	<ul>
		<li><a href=''>Menu 4-1</a></li>
		<li><a href=''>Menu 4-2</a></li>
		<li><a href=''>Menu 4-3</a></li>
		<li><a href=''>Menu 4-4</a></li>
	</ul>
</li>
<li><a href=''>Menu 5</a></li>
<li><a href=''>Menu 6</a></li>
</ul></body></html>

Dieses Beispiel könnt Ihr unter folgendem Link erreichen: http://root.markush.ch/format.php

Ich hoffe, Ihr könnt mir den entscheidenden Tipp geben - Danke schon mal im Vorraus.

Gruss Markus
 
MarkusH

MarkusH

Stammgast
Ja und Nein

Auf der endgültigen Seite habe ich vor dem Link noch ein Bild, welches auch im Rahmen liegen soll.
Code: 
<li><img><a></a></li>
Aus diesem Grund lege ich den hover-Effekt auf das LI-Element.
Das habe ich hier der Einfachheit wegen weggelassen.
 
Pagnol

Pagnol

Stammgast
Also bei deinem Beispiel "hovert" bei mir (IE 9) erwartungsgemäss nur das berührte Li-Element.
Welchen Browser verwendest du? Vielleicht liegt der Fehler ja dort!

Edit:
Das Bild liesse sich ja ebenfalls im <a>-Tag unterbringen: <li><a><img>irgend ein Text</a></li>
 
Zuletzt bearbeitet:
MarkusH

MarkusH

Stammgast
Ja CSS halt - es ist schon komisch

Bei der eigentlichen Webseite, wird im IE sowie auch im Firefox auch der "Parent" markiert, wenn ich über ein "Kind" fahre.
Meine Testseite wird nur im Firefox markiert - im IE passiert auch bei der oberen Ebene gar nichts.

@Nebuk:
Dake für den Tipp - ich denke, dass ich es mit DIVs lösen werde.

Danke für die raschen Antworten
 
S

Schorschl

Gesperrt
Gesperrt
Nebuk schrieb:
Nun, CSS ist halt immer so eine Sache :D.
Zum Vergrößern anklicken....

äh...eigentlich ist CSS einfach nur CSS und nicht "so eine Sache". sie funktioniert wenn man sie anwendet wie hier beschrieben www.w3schools.com, immer...


@markush

so, jetzt werden wir mal konstruktiv. ehrlich gesagt war ich schlicht zu faul um es noch einmal abzutippen, also lies einfach die letzten vier posts hier (codewort: ul li a):

http://forum.chip.de/webentwicklung-datenbanken/hover-ueber-li-textfarbe-aendern-1508752.html

entweder löst das dein problem oder ich habe es nicht ganz verstanden.

im übrigen wäre ich schön traurig, wenn das bei dir wirklich so in der datei steht, wie du das hier zu anfang reingepostet hast.

man macht doch keine css mehr ins html dokument rein! man trennt design vom inhalt. und das "S" in css steht doch für sheet, also bitte tu mir einen gefallen und gib ihm ein eigenes blatt. im namen der vereinigung "stoppt die vergewaltigung von css" danke ich dir für dein einsehen :D
 
MarkusH

MarkusH

Stammgast
Schorschl schrieb:
äh...eigentlich ist CSS einfach nur CSS und nicht "so eine Sache". sie funktioniert wenn man sie anwendet wie hier beschrieben www.w3schools.com, immer...
Zum Vergrößern anklicken....

Grundsätzlich ja schon, ausser, dass einige Browserhersteller unfähig sind/sich weigern/etc. sämtliche Möglichkeiten zu unterstützen

Schorschl schrieb:
man macht doch keine css mehr ins html dokument rein! man trennt design vom inhalt.
Zum Vergrößern anklicken....

Das habe ich in der definitiven Seite auch nicht so gemacht - ich habe es nur hier als Beispiel so geschrieben, da es auch nur sehr wenig Code ist.
In der fertigen Seite ist die CSS Datei auch "ein wenig" umfangreicher.

Danke für den Link, ich werde mir den ansehen, sobald ich dazu komme - sollte eigentlich in den nächsten 1-2 Tagen sein.

Danke und Gruss

Markus
 
Nebuk

Nebuk

PCtipp-Moderation
Teammitglied
Schorschl schrieb:
äh...eigentlich ist CSS einfach nur CSS und nicht "so eine Sache". sie funktioniert wenn man sie anwendet wie hier beschrieben www.w3schools.com, immer...
Zum Vergrößern anklicken....

Ich habe nie behauptet, dass CSS nicht funktioniert, wenn man es (mehr oder weniger) beherrscht. Beruflich beschäftige ich mich mehrheitlich um Funktionen bzw. Funktionalitäten von Webseiten (Rich Client Application -> Java/C#), für das Design, das CSS sind andere zuständig. Bei Kleinigkeiten habe ich natürlich wenig Mühe, sobald das CSS etwas aufwändiger wird, lasse ich es lieber bleiben da ich sonst einfach viel länger brauche als jemand der es "beherrscht". Die CSS Welt ist nicht meine :)
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Oben