Aperçu de la table de lignes sur le vol stationnaire

Je suis en train de mettre en évidence la frontière d'une ligne de tableau sur le vol stationnaire. Malheureusement, cela ne fonctionne que pour la première rangée de cellules. Lignes du bas ont une frontière qui ne change pas de couleur. J'ai essayé d'utiliser outline mais cela ne veut pas jouer gentil avec :hover dans webkit.

http://jsfiddle.net/S9pkM/2/

Imaginez votre table standard html. Certains tr avec certains de la td. Le survol d'une ligne doit mettre en évidence sa bordure rouge.

table { border-collapse: collapse; } /*I am aware of separate */
table td { border: 3px solid black; }
table tr:hover td { border-top-color: red; border-bottom-color: red; }
table tr:hover td:first-child { border-left-color: red; }
table tr:hover td:last-child  { border-right-color: red; }

Je suis ouvert à d'autres approches, mais je suis coincé avec la structure de la table. Aucune insertion de html supplémentaire en plus de la norme <table> <tr> <td>

Je pense que c'est pas à cause de :hover. C'est la façon dont le tableau se comporte.

OriginalL'auteur mrtsherman | 2011-11-14