horizontal-tabs.css 2.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101
  1. div.horizontal-tabs {
  2. margin: 0 0 1em 0; /* LTR */
  3. padding: 0;
  4. border: 1px solid #ccc;
  5. position: relative; /* IE6/7 */
  6. }
  7. .horizontal-tabs ul.horizontal-tabs-list {
  8. display: inline-block;
  9. margin: 0;
  10. border: 0;
  11. padding: 0px;
  12. position: relative; /* IE6 */
  13. list-style: none;
  14. list-style-image: none; /* IE6 */
  15. background-color: #dedede;
  16. border-right: 1px solid #dedede; /* LTR */
  17. width: 100%;
  18. height: auto;
  19. clear: both;
  20. }
  21. .horizontal-tabs fieldset.horizontal-tabs-pane {
  22. padding: 0 1em;
  23. border: 0;
  24. }
  25. fieldset.horizontal-tabs-pane > legend,
  26. fieldset.vertical-tabs-pane fieldset.horizontal-tabs-pane > legend {
  27. display: none;
  28. }
  29. /* Layout of each tab */
  30. .horizontal-tabs ul.horizontal-tabs-list li {
  31. background: #eee;
  32. border-right: 1px solid #ccc; /* LTR */
  33. padding: 1px;
  34. padding-top: 0;
  35. margin: 0;
  36. min-width: 5em; /* IE7 */
  37. float: left; /* LTR */
  38. }
  39. .horizontal-tabs ul.horizontal-tabs-list li.selected {
  40. background-color: #fff;
  41. padding: 0 0 1px 0;
  42. }
  43. .horizontal-tabs ul.horizontal-tabs-list li a {
  44. display: block;
  45. text-decoration: none;
  46. padding: 0.5em 0.6em;
  47. }
  48. .horizontal-tabs ul.horizontal-tabs-list li a:hover {
  49. outline: none;
  50. background-color: #ededdd;
  51. }
  52. .horizontal-tabs ul.horizontal-tabs-list li:hover,
  53. .horizontal-tabs ul.horizontal-tabs-list li:focus {
  54. background-color: #ddd;
  55. }
  56. .horizontal-tabs ul.horizontal-tabs-list :focus {
  57. outline: none;
  58. }
  59. .horizontal-tabs ul.horizontal-tabs-list li a:focus strong,
  60. .horizontal-tabs ul.horizontal-tabs-list li a:active strong,
  61. .horizontal-tabs ul.horizontal-tabs-list li a:hover strong {
  62. text-decoration: none;
  63. outline: none;
  64. }
  65. .horizontal-tabs ul.horizontal-tabs-list li a,
  66. .horizontal-tabs ul.horizontal-tabs-list li.selected a {
  67. display: block;
  68. text-decoration: none;
  69. padding: 0.5em 0.6em 0.3em 0.6em;
  70. position:relative;
  71. top: 0px;
  72. }
  73. .horizontal-tabs ul.horizontal-tabs-list .selected strong {
  74. color: #000;
  75. }
  76. .horizontal-tabs ul.horizontal-tabs-list .summary {
  77. display: block;
  78. }
  79. .horizontal-tabs ul.horizontal-tabs ul.horizontal-tabs-list .summary {
  80. line-height: normal;
  81. margin-bottom: 0;
  82. }
  83. /**
  84. * tab content
  85. */
  86. div.field-group-htabs-wrapper .field-group-format-wrapper {
  87. clear: both;
  88. padding: 0 0 0.6em;
  89. }
  90. /*hide*/
  91. .horizontal-tabs .horizontal-tab-hidden {
  92. display: block;
  93. position: absolute;
  94. top: -100000px;
  95. width: 100%;
  96. }