nicht angemeldet
Hallo, Fabian.
ist es bei Tabellenzellen und OnClick immer so, dass die gesamte Zelle dann sensitiv ist? Das hat mich bei Links in Tabellen nämlich schon immer gestört, das nur der Text selbst Link war und nicht die ganze Zelle.
da kann man schön spielen, mit solchen konstrukten. (...)
"Die Idee ist gut, doch die (Browser-)Welt noch nicht bereit." Opera dreht bei height:100% völlig am Rad, auch ohne das macht er probleme mit den Linkunterstreichungen.
Wenn man einen Rand zwischen Zellenrahmen und Text sowie einen beim Hovern sich ändernden Hintergrund möchte, muss man, wenn man deine Version verwendet, logischerweise td {padding:0} und td a {padding:[>0]} setzen, woraufhin bei height:100%; im Mozilla ein padding zwischen dem Blockelement und den Zellenrändern angezeigt wird. Das tritt natürlich nur auf, weil height:100% das padding nicht mit einschließt.
Also kann man die Hintergrundfarbe höchstens über td:hover ändern, womit aber nicht das Problem des paddings gelöst wäre. Egal wo man es unterbringt, es ist strenggenommen falsch, wenn es auf td a angewendet wird und gleichzeitig width/height:100% genutzt wird. Glücklicherweise ignorieren das scheinbar IE und Mozilla, sodass eine solche Lösung zumindest halb im IE und ganz im Mozilla funktionieren würde:
td {border:Xpx solid #XXX; padding:0; vertical-align:top; background-color:#XXX;}
td:hover {background-color:#XXX;}
td a {display:block; margin:0; padding:Xpx; color:#XXX; background-color:transparent; width:100%; height:100%;}
IE zeigt wie gesagt kein Hovereffekt an, und Opera spielt völlig verrückt. Was lernt uns das? ;) Mit einer feinen Dosis JavaScript kann man diese ganzen Probleme umgehen. CSS ist hier (noch) fehl am Platze.
das kommt IMO dem auch schon ziemlich nahe, ohne irgendwelche JS-Verenkungen zu machen ;-)
Ich würde konventionell mit <td onclick="window.location.href='...'" ><a href="...">...</a></td> arbeiten. Für die Effekte nimmt man AFAIR this.className - ich habe für das fanhost.de-Forum mal ein halbes Dutzend Versionen erstellt, welche genau einen solchen Effekt programmiert (Hintergrundfarbe und -bild sollten sich ändern bei Mouseover und die komplette Zelle anklickbar sein).
(von der space-minimierung will ich garnicht reden, wenn ich die eventhandler so umgehen kann... ;-) )
Die JavaScript-Version bereitet imho momentan weniger Probleme.
Grüße,
Mathias