ARTICLE AD BOX
I am trying to get a simple image to hover to a different image. I have tried multiple ways of doing this, including the nav tag in HTML5 to poor results. Here's what I got:
HTML:
<nav> <a href="#">Merchandise</a> </nav>CSS:
.nav:hover {*/ background: url("images/rocket.jpg") top left no-repeat; !* Image on hover *!*/ }
5
![iframe display automatically responsive on mobile and tablet [closed]](https://stackoverflow.com/Content/Sites/stackoverflow/Img/apple-touch-icon@2.png?v=73d79a89bded)
Please clarify your specific problem or add additional details to highlight exactly what you need. As it's currently written, it’s hard to tell exactly what you're asking.
2026-02-01 21:55:45 +00:00
Commented 9 hours ago
You have .nav but if you are trying to do something on hovering the nav element you need just nav
2026-02-01 21:59:24 +00:00
Commented 9 hours ago
Could you create a proper runnable snippet? At the moment your CSS makes no sense with the / and !
2026-02-01 22:00:28 +00:00
Commented 8 hours ago
Add a class to your <nav> with different CSS properties, in particular, with different background image. Toggle this class when you have to change the image.
2026-02-02 01:45:58 +00:00
Commented 5 hours ago
Also, your selector .nav:hover is incorrect. It looks like you had a CSS class nav, but you don't have it. Instead, use nav { *...* } or nav:hover { *...* } (where :hover is a pseudo-class).
2026-02-02 01:48:34 +00:00
Commented 5 hours ago