Mon, 2013-07-15 20:48
I'm running into a bit of an issue using a sprite as a link. I've done this before, but can't figure out why it's not working in this case.
The page in question is here: http://n2glam.com/teeth-whitening/
Basically, I'm working with the top image (#teeth_whitening_side). There are 6 total, so if one is missing, it's the top one that I'm working with. Anyway, heres the HTML
<div id="teeth_whitening_side"> <a class="teeth_whitening_side_link" href="http://n2glam.com/teeth-whitening/"><span> </span></a> </div>
CSS is as follows:
#teeth_whitening_side a{height:200px;width:300px;background:url(<a href="http://n2glam.com/wp-content/uploads/2013/07/teeth-whitening-side2.jpg" rel="nofollow">http://n2glam.com/wp-content/uploads/2013/07/teeth-whitening-side2.jpg</a>);} #teeth_whitening_side a:hover{ background-position:bottom;)}
Any help is appreciated. Thanks.
Mon, 2013-07-15 20:51
#1
I should also note that I've
I should also note that I've tried applying the display:block attribute to the link. Problem is, it make the image slide up instead of flashing as the other 5 images below do. I want that effect with a link.
Mon, 2013-07-15 21:07
#2
nvm, I feel so stupid. There
nvm, I feel so stupid. There was a transition effect going on with CSS that we written previous to me coming along with my code. Any way to close this thread?
Tue, 2013-07-16 19:13
#3
You just did. cheers, gary
You just did. 
cheers,
gary