Changing anchor font color during a <td> hover?

I want to change the text color of an anchor link that sits in a table cell on a hover. However, the change I wrote in my CSS file to accomplish this, doesn't seem to work. Could someone suggest what I might be doing incorrectly?

This is what I have in my CSS file:

td:hover {
    text-align: center;
    bac开发者_如何学运维kground:white;
    a:active { color:red; }
}

Thanks!

---

Or elaborating on prdigitalson's sugggestion, if you only want that behavior on the anchors in the TD, you can go this way:

td:hover {text-align: center; background:white;} 
td:hover a:active {color:red; text-align: center;}

This says only change the color and alignment of active anchors in cells that you are hovering over. In general, it's a bad idea to change text alignment on hover.

Here's what I suggest

td:hover {background-color:white;}
td:hover a:active {color:red;}

---

The :hover won't work in IE6 which supports only links. However, the workaround is to use whatever hover

Most modern browsers support the :hover selector for any html element. This is cool, because it enables you to, for instance, apply a mouseover effect to table rows using only CSS. IE however, has an erratic support for :hover at best, depending on the particular version your visitor is using.

Whatever:hover is a small script that automatically patches :hover, :active and :focus for IE6, IE7 and IE8 quirks, letting you use them like you would in any other browser. Version 3 introduces ajax support, meaning that any html that gets inserted into the document via javascript will also trigger :hover, :active and :focus styles in IE.

---

Assuming those arent typos your CSS is mangled... should be:

td:hover {text-align: center; background:white;} 

a:active {color:red; text-align: center;} /* or whatever text-align value youre after here */

But keep in mind non a elements dont support the :hover pseudo element in certain browsers and versions.

---

table table td:hover {
  background: #89A6A1;
}
table table td:hover * {
  color: black !important;
}