HOVER Effekt auch auf innenliegende Objekte

Orex

Grünschnabel
Nachdem die Suche mit mir nur so redet:
Internal Server Error

The server encountered an internal error or misconfiguration and was unable to complete your request.

Please contact the server administrator, hostmaster@tutorials.de and inform them of the time the error occurred, and anything you might have done that may have caused the error.

More information about this error may be available in the server error log.


Ich habe das Problem, dass ich einen einfachen hover Effekt in einer Tabellenspalte habe.
Der Hovereffekt ändert den Spaltenhintergrund und die Schriftfarbe. Das geht soweit so gut. Nur ist der Text in <a> Tags als Link und ändert deshalb seine Schriftfarbe nicht mit.

Wie schaffe ich es, dass wenn der user über die Spalte geht (nicht nur über den Text) sich auch die Eigenschaften des darin eingebetteten Links ändern ?


also Bsp.:

HTML:
<td class="hover_effekt">< a href="#">Link</a> </td>

HTML:
TD.hover_effekt{
background:#dfdfdf;
color:#000000;
}

TD.hover_effekt:hover{
background:#2d2d2d;
color:#e7e7ed;
}

Jetzt ändert sich die Schriftfarbe nur wenn der Text nicht in einem <a> Tag ist. Leider logisch aber wie umgeh ich das ?
Hab schon viel probiert aber es geht alles nur wenn man auch über den Link geht. Es soll sich die Farbe aber schon ändern wenn man nur irgendwo über der Spalte ist....

Falls wer was weiss würd mich freuen.
Vielen Dank.
 
Hi,

und wieso wendest du den Hover-Effekt nicht einfach und direkt auf den Link an?

Hier ein kleines Beispiel, das demonstriert, wie die Hintergrundfarbe des Links die Tabellenzelle vollständig ausfüllt, falls dies dein Vorhaben ist:

Code:
<table border="1" cellpadding="0" cellspacing="0">
       <tr>
           <td><a href="#">Link</a></td>
       </tr>
</table>
Code:
td {
width:200px;
height:30px;
}

a {
background:#dfdfdf;
color:#000000;
display:block;
height:100%;
}

a:hover {
background:#2d2d2d;
color:#e7e7ed;
}


mfg Maik
 
Super funktioniert!
Wusste nicht, dass ich auf <a> tags auch Größeneigenschaften anwenden kann.


Vielen Dank für die Hilfe und die schnelle Antwort! TOP! :)
 
Super funktioniert!
Wusste nicht, dass ich auf <a> tags auch Größeneigenschaften anwenden kann.


Vielen Dank für die Hilfe und die schnelle Antwort! TOP! :)
Bitte bitte, keine Ursache :)

Das a-Element, das zu den Inline-Elementen zählt, kann eine Größeneigenschaft aber nur dann annehmen, wenn es "Block-Level-Charakteristika" erhält, sei es durch display:block oder eine float-Deklaration (left o. right).

mfg Maik
 
Zurück