html5 - CSS3 Hover not working for a Button image to change -
i clueless here. have hover functions working fine on nav menu ul li trying hover single button, , after staring @ code on 15 minutes, not clue...
this html:
<div> <a id="backbutton" href="services.html" title="go services">go back</a> <br /> </div> this css3:
#backbutton { display: block; width: 200px; height: 54px; background: url('../images/backbutton.png') center center no-repeat; text-indent: -9999px; } this 1 above working totally fine. text gone , button displays properly. it's below code not working
#backbutton a:hover { background: url('../images/backbuttonhover.png') center center no-repeat; width: 200px; height: 54px; } the image not replace targeted hover image (yes, uploaded on server.)
any clues?
#backbutton a:hover to
#backbutton:hover #backbutton { display: block; width: 200px; height: 54px; background: url('http://wiki.openstreetmap.org/w/images/1/1c/openclosed.png') center center no-repeat; } #backbutton:hover { background: url('https://encrypted-tbn3.gstatic.com/images?q=tbn:and9gctic0kojupsnsp7qfgktszyccyzztalf58mrnztinw19zw5wv8h1g') center center no-repeat; width: 200px; height: 54px; } <a id="backbutton" href="#" title="go services">go back</a>
Comments
Post a Comment