Posted By

studioevoque on 05/15/11


Tagged

css


Versions (?)

Simple CSS Image Rollover link


 / Published in: CSS
 

URL: http://www.elated.com/articles/css-rollover-buttons/

A simple way to style a link using a CSS sprite. On hover, the image is moved upwards by the image height to reveal the rollover image.

  1. #emailUs
  2. {
  3. display: block;
  4. width: 107px;
  5. height: 23px;
  6. background: url("emailUs.gif") no-repeat 0 0;
  7.  
  8. }
  9.  
  10. #emailUs:hover
  11. {
  12. background-position: 0 -23px;
  13. }
  14.  
  15. #emailUs span
  16. {
  17. position: absolute;
  18. top: -999em;
  19. }

Report this snippet  

You need to login to post a comment.