[CSS][JQUERY] mouseover i display block Opcje

[corvus606]

Mam coś takiego:

[JAVASCRIPT] pobierz, plaintext 
$("body").delegate('tr','mouseover mouseleave', function(e){
    if (e.type == 'mouseover') {
        $(this).addClass('hover');
    } else {
        $(this).removeClass('hover');
    }
});
[JAVASCRIPT] pobierz, plaintext 

I coś takiego:

[HTML] pobierz, plaintext 
<table>
<tr onClick="location.href='costam.php';">
<td><p></p></td>
<td><p></p></td>
</tr>
 
<tr onClick="location.href='costam2.php';">
<td><p></p></td>
<td><p></p></td>
</tr>
</tr>
</table> 
[HTML] pobierz, plaintext 

I na koniec coś takiego:

[CSS] pobierz, plaintext 
tr.hover{
    list-style-type: none;
 
 
    text-align:center;
 
    text-decoration: none;
 
 
    width: auto;
    display: block;
 
	background-color: #FAFAFA;
 
	border-style: solid;
    border-bottom-color: #333333;
    border-right-color: #555555;
    border-left-color: #BBBBBB;
    border-top-color: #DDDDDD;
 
	border-width: 2px;
 
 
 
}
[CSS] pobierz, plaintext 

Problem polega na tym, że kiedy nakierowywuję myszką na dany wiersz to z powody display:block tenże wiersz próbuje zająć szerokość pojedynczej komórki wiersza poniżej. Bez display:block z kolei nie działają polecenia css typu border-bottom itd.
Nie potrafię wyjść z tego problemu...

Ten post edytował corvus606 20.01.2012, 03:16:44

[lobopol]

1. Nie mam pojęcia z czym masz problem http://jsfiddle.net/zc87s/
2. Na diabła do zmiany stylu potrzebujesz tam jQuery