PDA

View Full Version : change rollover color of tr


esthera
Jan 26th, 2009, 12:09 PM
I have a table that has text and some links on each row.
I'd like to change the background color of the whole tr on rollover - is this possible? (not just the links but the whole tr?)
abduraooft
Jan 26th, 2009, 12:15 PM
tr:hover{
background:#ccc;
} though you'd need to add some javascript :hover fix for IE.
esthera
Jan 26th, 2009, 12:20 PM
How would I do for ie also?
BoldUlysses
Jan 26th, 2009, 03:53 PM
whatever:hover (http://www.xs4all.nl/~peterned/csshover.html) is a script I've had good experience with. The page tells you how to use it.
esthera
Jan 26th, 2009, 07:03 PM
it doesn't work even in firefox


my code is

.spreadtable tr:hover{
background-color:#ffffcc;

}

and the table is table class="spreadtable"

what am I doing wrong?
BoldUlysses
Jan 26th, 2009, 07:10 PM
Not sure. This works in both Safari and FF3:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

<title>site 126</title>

<style type="text/css">

.spreadtable {
background:#0f0;
}

.spreadtable tr:hover {
background-color:#ffc;
}

</style>

</head>

<body>

<table class="spreadtable">
<tr>
<td>Sample content.</td>
<td>Sample content.</td>
<td>Sample content.</td>
</tr>
<tr>
<td>Sample content.</td>
<td>Sample content.</td>
<td>Sample content.</td>
</tr>
<tr>
<td>Sample content.</td>
<td>Sample content.</td>
<td>Sample content.</td>
</tr>
</table>

</body>
</html>

Post your whole code and/or a link to your page. Chances are something else is affecting things.