advanced search

We Recommend

The Definitive Guide to Django The Definitive Guide to Django
In The Definitive Guide to Django: Web Development Done Right, Adrian Holovaty, one of Django’s creators, and Django lead developer Jacob Kaplan–Moss show you how they use this framework to create award–winning web sites.

Posted By

designerd on 10/06/06


Tagged

css tabs


Versions (?)


tabs

Published in: Other 

Plain TextExpand 
  1. /* TABS */

  2.  
  3. #tabs {

  4.   position: absolute;

  5.   top: 59px;

  6.   right: 0;

  7.   width: 100%;

  8. }

  9.  
  10.  
  11.  
  12.  
  13.  
  14. #tabs ul {

  15.   margin:0;

  16.   padding: 10px 10px 0 110px;

  17.   list-style:none;

  18.   text-align: right;

  19. }

  20. #tabs li {

  21.  
  22.   float:left;

  23.   background:url("../pix/left_both.gif") no-repeat left top;

  24.   margin:0 0 0 0;

  25.   padding:0 0 0 9px;

  26.   border-bottom: 1px solid #765;

  27. }

  28. #tabs a {

  29.   float:left;

  30.   display:block;

  31.   width:.1em;

  32.   background:url("../pix/right_both.gif") no-repeat right top;

  33.   padding:5px 15px 4px 6px;

  34.   text-decoration:none;

  35.   font-weight:bold;

  36.   color:#fff;

  37.   font-size: 11px;

  38.   white-space: pre;

  39.  
  40. }

  41. #tabs > ul a {width:auto;}

  42.   /* Commented Backslash Hack hides rule from IE5-Mac \*/

  43. #tabs a {float:none;}

  44. /* End IE5-Mac hack */

  45. #tabs a:hover {

  46.   color:#333;

  47. }

  48. #home #nav-home, #titels #nav-titels,

  49. #products #nav-products, #about #nav-about,

  50. #contact #nav-contact {

  51.   background-position:0 -150px;

  52.   border-width:0;

  53. }

  54. #home #nav-home a, #titels #nav-titels a,

  55. #products #nav-products a, #about #nav-about a,

  56. #contact #nav-contact a {

  57.   background-position:100% -150px;

  58.   padding-bottom:5px;

  59.   color:#333;

  60. }

  61. #tabs li:hover, #header li:hover a {

  62.   background-position:0% -150px;

  63.   color:#333;

  64. }

  65. #tabs li:hover a {

  66.   background-position:100% -150px;

  67. }

Report this snippet 

You need to login to post a comment.