Hovering Image with another image

Question

I am trying to replace the image #about with another image on hover and no matter what I do I can't get it to work.

Help appreciated thanks!

#about {
    width: 150px; 
    height: 117px; 
    padding-top: 100px; 
}

#about:hover {
    background-image: url("about_button2.png"); 
}

Possible duplicate of [Changing image on hover with CSS/HTML](https://stackoverflow.com/questions/18813299/changing-image-on-hover-with-css-html) — Yassine CHABLI, Apr 20 '18 at 19:50
yes. I looked at the "Changing image on hover with CSS/HTML" question and it didn;t help. — anonymouslyAJ, Apr 20 '18 at 19:51

score 0 · Answer 1 · edited Apr 20 '18 at 22:04

0

#about {
    width: 150px; 
    height: 117px; 
    padding-top: 100px;
    background-color: gray; 
}

#about:hover {
    background-image: url("https://i.stack.imgur.com/mw9tP.png");
}

<html>
    <body>
        <div id="about"></div>
    </body>
</html>

edited Apr 20 '18 at 22:04

aroabarberan

157
1
2
10

answered Apr 20 '18 at 20:28

Shakil Hossain

1,701
13
25

Hovering Image with another image

1 Answers1