changing color of text in a div on mouseover

I'm having a little trouble with this.
I have in my style head:

Code:

---

.catlink {COLOR: #FFFFFF; font-family: Arial, Verdana, Gill Sans, sans-serif; font-size: 8pt; TEXT-DECORATION: none; }
.catlink:hover {COLOR: #999999; font-family: Arial, Verdana, Gill Sans, sans-serif; font-size: 8pt; text-decoration: none; font-weight: none; }

---

I tried:

Code:

---

<div id="block_StayPolicy1" class="catlink" onClick="dateChange('1')">11/1/01 - 12/31/02, 1</div>

---

but that didn't work for mousing over, just with the normal state
then I tried:

Code:

---

<div id="block_StayPolicy1" onClick="dateChange('1')"><a href=# class="catlink">11/1/01 - 12/31/02, 1</a></div>

---

but that caused the href=# to fire rather than the onClick
thanks
michael

got it :)

Code:

---

<div id="block_StayPolicy1"><a href="JavaScript:dateChange('1')" class="catlink">11/1/01 - 12/31/02, 1</a></div>

---

michael

that onclick goes to another page (in a hidden frame) and runs some outer html calls
for some reason when I do that like above it causes the progress bar (in ie5.5, havent tested w/any other) to move across slowly... even though it finishes its task very quickly. it never did that before I implemented the mouseover effect.
any ideas on this?
thanks
michael

I don't know why it is affecting progress bar so. That is odd. But I would love to know why exactly the first way you tried didn't work. I would've expected it to.

I tried it that first way again to be sure it wasnt me... it still didnt work (for mouseover) and the progressbar thing was normal again.

I got to thinking, maybe the first way you tried would work with a span instead of a div. I don't know if maybe several of the properties you are settting are confined to inline and thus don't work on block level.

it behaved the same way... wouldent mouseover (or hover rather)
michael

maybe becasue the first one was not a link? it was just a container with words in it.

the second one would have worked but you needed to put the onclick in the <a href> tag.

<div id="block_StayPolicy1" ><a href="#" class="catlink" onClick="dateChange('1')">11/1/01 - 12/31/02, 1</a></div>