CSS Rollover, Image then Text

I have a predicament.

I want to make a CSS rollover. This is not a problem with 2 images. But I am trying to figure out how to do it the following way.

I have 1 image for the UP state. I would like the OVER state to be nothing but text. I have a solid background color. Image size is 108x108. Text will need to fit in same area.

Ideas? I will keep messing around with it, but I appreciate any direction.



view the source

very, very close.

the biggest problem I have is the text being visible on the UP state. The OVEr state performs just as desired. I need to have ONLY the image showing on the UP state.

thank you for your quick response.


if you set the width and height in a different place it’ll work, I just didn’t get that part working…