Problem mit verkapselten :hover
nickyname
- css
Hallo,
hier mein Quellcode (der große <div>-Absatz in der Mitte darin enthält das
Ziel, das ich erreichen möchte!)
Für Eure Hilfe wäre ich Euch sehr dankbar!
==========================================
<html>
<head>
<title></title>
<style type="text/css">
li#ebene1:hover{
background-color:red;
}
li#ebene2:hover{
background-color:yellow;
}
</style>
</head>
<body>
<div style="border:1px solid black; background-color:Lightblue; width:50%;">
Bei :hover ueber den Punkten der 2.Ebene soll das :hover des Listenpunktes
der 1.Ebene gleichzeitig nicht mit aktiviert werden. Die Listenstruktur
darf dabei nicht veraendert werden !!! Ist das mit einer reinen
CSS-Loesung moeglich?
</div>
<ul>
<li id="ebene1">Menue-Punkt 1
<ul>
<li id="ebene2">Menue-Punkt 1.1</li>
<li id="ebene2">Menue-Punkt 1.2</li>
</ul>
</li>
</ul>
</body>
</html>
mahlzeit!
füg statt deiner Tabelle diese ein:
<ul>
<li id="ebene1">Menue-Punkt 1</li>
</ul>
<ul><ul>
<li id="ebene2">Menue-Punkt 1.1</li>
<li id="ebene2">Menue-Punkt 1.2</li>
</ul></ul>
Zwar unprofessionell aber funzt
mfg Danzi
hi,
füg statt deiner Tabelle diese ein:
Welcher Tabelle?
<ul><ul>
Zwar unprofessionell aber funzt
Es ist hochgradig fehlerhaft, und damit vollkommen blödsinnig.
gruß,
wahsaga
sry meinte natürlich liste.
was würdest du vorschlagen?
mfg
Tach,
Bei :hover ueber den Punkten der 2.Ebene soll das :hover des Listenpunktes
der 1.Ebene gleichzeitig nicht mit aktiviert werden. Die Listenstruktur
darf dabei nicht veraendert werden !!! Ist das mit einer reinen
CSS-Loesung moeglich?
nein, es ist mit CSS nicht möglich Vorfahren abhängig vom Zustand eines Nachfahren zu selektieren.
mfg
Woodfighter
Hallo,
hier mein Quellcode (der große <div>-Absatz in der Mitte darin enthält das
Ziel, das ich erreichen möchte!)Für Eure Hilfe wäre ich Euch sehr dankbar!
==========================================
<html>
<head>
<title></title>
<style type="text/css">
li#ebene1:hover {background-color:red;}
li#ebene2:hover {background-color:yellow;}
</style>
</head>
<body>
<div style="border:1px solid black; background-color:Lightblue; width:50%;">
</div>
<ul>
<li id="ebene1">Menue-Punkt 1
<ul>
<li id="ebene2">Menue-Punkt 1.1</li>
<li id="ebene2">Menue-Punkt 1.2</li>
</ul>
</li>
</ul>
</body>
</html>
Neben dem, was dir Jens schon geschrieben hat, ist dein Code fehlerhaft. Eine ID identifiziert genau \_ein\_ Objekt und darf somit dateiweit nur ein einziges Mal vorkommen.
Du solltest also in deinem Fall [Klassen](http://de.selfhtml.org/css/formate/zentrale.htm#klassen) verwenden.
Gruß Gunther
Servus,
Du solltest also in deinem Fall Klassen verwenden.
Soweit man aus dem Beispiel schließen kann ist das völlig überflüssig. Es gibt auch Nachfahren-Selektoren.
@nickyname:
Wie Jens ja schon erwähnt hat, kannst du nicht "aufwärts" selektieren. Eine Möglichkeit das zu umgehen wäre, den Inhalt der ersten Ebene in ein span zu packen und dieses bei hover zu selektieren. Also z.B:
li:hover span {}
li li:hover {}
Gruss
Patrick
Servus,
li:hover span {}
Das ist natürlich Unfug und ändert garnix am Problem ;) Es sollte so heissen:
li span:hover {}
Gruss
Patrick
Hi,
Du solltest also in deinem Fall Klassen verwenden.
Wozu? Kind- und Nachfahrenselektor existieren (letzteren kann sogar der IE vor 7.0).
cu,
Andreas
Hi,
Du solltest also in deinem Fall Klassen verwenden.
Wozu? Kind- und Nachfahrenselektor existieren (letzteren kann sogar der IE vor 7.0).
ja liebe Leute das müsst ihr den OP fragen - nicht mich!
Ich wollte ihn lediglich darauf hinweisen, dass sein Code so nicht valide ist!
Und wenn er schon IDs vergeben hat, dann sollte er stattdessen vermutlich besser Klassen verwenden, da ich davon ausgehe, dass es ihm um die Zuordnung der LIs geht.
Und eure Argumente haben den Nachteil, dass sie sich dann erstmal pauschal auf alle Listen beziehen, und wer weiss, ob das so entsprechend gewünscht ist.
Alles Fragen, die nur der OP beantworten kann. Also bitte an den wenden - Danke!
Gruß Gunther