Posted By

ricosushi on 07/14/10


Tagged

navigation


Versions (?)

Who likes this?

3 people have marked this snippet as a favorite

ricosushi
grzyweasel
TraceyM


li backgrounded navigation


 / Published in: CSS
 

URL: http://alianzadefutbol.com/2010/home.php

li navigation with background hover

  1. ul#top-nav{
  2. width: 398px;
  3. height: 24px;
  4. position: absolute;
  5. top: 124px;
  6. left: 280px;
  7. }
  8.  
  9. ul#top-nav li{
  10. background: url(img/top-nav-sprite.png) no-repeat;
  11. height: 24px;
  12. float: left;
  13. }
  14.  
  15.  
  16. ul#top-nav li {
  17. display: block;
  18. height: 24px;
  19. width: 100%;
  20. text-indent: -9000px;
  21. }
  22.  
  23. li#first{
  24. width: 122px;
  25. background-position: 0px 0px;
  26. }
  27.  
  28. li#first{
  29. background-position: 0px -24px;
  30. }
  31.  
  32.  
  33. // usage
  34. <ul id="top-nav">
  35. <li id="first"><a href="quienes.php">LINK</a></li>
  36. <li id="second"><a href="blogs.php">LINK</a></li>
  37. </ul>

Report this snippet  

You need to login to post a comment.