jquery.tabs.css 2.9 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798
  1. /* Caution! Ensure accessibility in print and other media types... */
  2. @media projection, screen { /* Use class for showing/hiding tab content, so that visibility can be better controlled in different media types... */
  3. .tabs-hide {
  4. display: none;
  5. }
  6. }
  7. /* Hide useless elements in print layouts... */
  8. @media print {
  9. .tabs-nav {
  10. display: none;
  11. }
  12. }
  13. /* Skin */
  14. .tabs-nav {
  15. list-style: none;
  16. margin: 0;
  17. padding: 0 0 0 4px;
  18. border-bottom:0px;
  19. }
  20. .tabs-nav:after { /* clearing without presentational markup, IE gets extra treatment */
  21. display: block;
  22. clear: both;
  23. content: " ";
  24. }
  25. .tabs-nav li {
  26. float: left;
  27. margin: 0 0 0 1px;
  28. min-width: 84px; /* be nice to Opera */
  29. }
  30. .tabs-nav a, .tabs-nav a span {
  31. display: block;
  32. padding: 0 10px;
  33. /*background: url(images/tab.png) no-repeat;*/
  34. }
  35. .tabs-nav a {
  36. position: relative;
  37. top: 1px;
  38. z-index: 2;
  39. padding-left: 0;
  40. /*color: #fff;*/
  41. font-size: 12px;
  42. font-weight: bold;
  43. line-height: 2;
  44. text-align: center;
  45. text-decoration: none;
  46. white-space: nowrap; /* required in IE 6 */
  47. }
  48. .tabs-nav .tabs-selected a {
  49. /*color: #fff;*/
  50. }
  51. .tabs-nav .tabs-selected a, .tabs-nav a:hover, .tabs-nav a:focus, .tabs-nav a:active {
  52. background-position: 100% -150px;
  53. outline: 0; /* prevent dotted border in Firefox */
  54. }
  55. .tabs-nav a, .tabs-nav .tabs-disabled a:hover, .tabs-nav .tabs-disabled a:focus, .tabs-nav .tabs-disabled a:active {
  56. background-position: 100% -100px;
  57. }
  58. .tabs-nav a span {
  59. width: 64px; /* IE 6 treats width as min-width */
  60. min-width: 64px;
  61. height: 18px; /* IE 6 treats height as min-height */
  62. min-height: 18px;
  63. padding-top: 6px;
  64. padding-right: 0;
  65. }
  66. *>.tabs-nav a span { /* hide from IE 6 */
  67. width: auto;
  68. height: auto;
  69. }
  70. .tabs-nav .tabs-selected a span {
  71. padding-top: 7px;
  72. }
  73. .tabs-nav .tabs-selected a span, .tabs-nav a:hover span, .tabs-nav a:focus span, .tabs-nav a:active span {
  74. background-position: 0 -50px;
  75. }
  76. .tabs-nav a span, .tabs-nav .tabs-disabled a:hover span, .tabs-nav .tabs-disabled a:focus span, .tabs-nav .tabs-disabled a:active span {
  77. background-position: 0 0;
  78. }
  79. .tabs-nav .tabs-selected a:link, .tabs-nav .tabs-selected a:visited, .tabs-nav .tabs-disabled a:link, .tabs-nav .tabs-disabled a:visited { /* @ Opera, use pseudo classes otherwise it confuses cursor... */
  80. cursor: text;
  81. }
  82. .tabs-nav a:hover, .tabs-nav a:focus, .tabs-nav a:active { /* @ Opera, we need to be explicit again here now... */
  83. cursor: pointer;
  84. }
  85. .tabs-nav .tabs-disabled {
  86. opacity: .4;
  87. }
  88. .tabs-container {
  89. border-top: 1px solid #97a5b0;
  90. padding: 1em 8px;
  91. /*background: #fff; declare background color for container to avoid distorted fonts in IE while fading */
  92. }
  93. .tabs-loading em {
  94. padding: 0 0 0 20px;
  95. /*background: url(images/loading.gif) no-repeat 0 50%;*/
  96. }