2 replies [Last post]
ipirate
Offline
Regular
Last seen: 16 years 35 weeks ago
Timezone: GMT-6
Joined: 2004-10-15
Posts: 14
Points: 0

I have a table that is getting populated with different rows of stuff, pretty standard fare. My problem is that I want the row to change background color when the user mouses-over it.

I have this in my style sheet:
.row :hover {
background-color: #CCCCCC;
}
(with each tr in the table that has certain data in it labled with that class)

When I hover over the row, only each seperate td changes its background color, the whole row never does it together, which is the desired effect.

here is a sample row from the table:

		<tr class="row">
			<td>2546BT</td>
			<td><input type="text" name="qty" value="1" size="3" /></td>
			<td>Tetons-Snake River<br />
			30.00 (w) x 24.00 (h) <br />
			By : Adams</td>
			<td>$31.69</td>
			<td><input type="checkbox" name="deleteThis" /></td>
		</tr>

Anyone have a suggestion? Thanks.[/code]

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 6 years 23 weeks ago
London
Joined: 2004-06-06
Posts: 15668
Points: 2806

:hover table row

write it as ,
.row:hover{ background-color: #ccc; }
or
tr.row:hover{background-color: #ccc}

This will not work in IE though if you require this effect in these browsers you will need to employ the whatever:hover file or use a mouseover js function .
Hope that helps,

Hugo.

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

ipirate
Offline
Regular
Last seen: 16 years 35 weeks ago
Timezone: GMT-6
Joined: 2004-10-15
Posts: 14
Points: 0

:hover table row

yeah it does help.

thanks, i figured it would be something as stupid as one space.