CSS image hover

  • Author
  • #937263

    I am using the forever theme. In my sidebar I have a couple of images (as widgets) which link, when clicked, to other sites. I’d like to have another image (same picture different color) replace the current image when it is hovered over. After I’ve added the new image to my media file, what css coding do I use to create the hover image?

    The blog I need help with is girlavantgarde.wordpress.com.


    The css coding I’ve come up with is:
    .widget {
    display: block;
    width: 100px;
    height: 100px;
    background: url(‘/path/to/myImage.png’) bottom;
    text-indent: -99999px;
    .widget:hover {
    background-position: 0 0;

    However, I’m having trouble figuring out where to put this in my style sheet, and also if there is something overriding it that is causing it not to work.


    I checked http://www.girlavantgarde.com/ and I found that site is setup using WordPress software, but it is not hosted here at WordPress.com. See http://support.wordpress.com/com-vs-org/ to learn about the differences.

    Can you please ask in the volunteer WordPress.org forums if you need further help? Support for WordPress.org blogs is done at http://wordpress.org/support/

The topic ‘CSS image hover’ is closed to new replies.