You are here

Home » API reference » Vertical Tabs 6

vertical_tabs.css in Vertical Tabs 6 

div.vertical-tabs {
  margin: 1em 0 1em 15em;
  border: 1px solid #ccc;
  display: none; /** Backport only CSS **/
}
div.vertical-tabs ul.vertical-tabs-list {
  width: 15em;
  list-style: none;
  list-style-image: none; /* IE6 */
  border-top: 1px solid #ccc;
  padding: 0;
  position: relative; /* IE6 */
  margin: -1px -100% -1px 0;
  left: -15em;
  float: left;
}
div.vertical-tabs .vertical-tabs-panes fieldset.vertical-tabs-pane {
  margin: 0 !important;
  padding: 0 1em;
  border: 0;
}
/*div.vertical-tabs .vertical-tabs-panes fieldset.vertical-tabs-pane legend {
  display: none;
}*/

/* Layout of each tab */
div.vertical-tabs ul.vertical-tabs-list li {
  background: #eee;
  border: 1px solid #ccc;
  border-top: 0;
  padding: 0;
  margin: 0;
  height: 1%;
}
div.vertical-tabs ul.vertical-tabs-list li a {
  display: block;
  text-decoration: none;
  padding: 0.5em 0.6em;
  line-height: 1.3em;
  height: 1%;
}
div.vertical-tabs ul.vertical-tabs-list li a:focus {
  position: relative;
  z-index: 5;
}
div.vertical-tabs ul.vertical-tabs-list li a:hover {
  text-decoration: none;
}
div.vertical-tabs ul.vertical-tabs-list li.selected {
  background: #fff;
  border-right-width: 0;
  position: relative;
}
div.vertical-tabs ul.vertical-tabs-list li.selected a:focus {
  outline: 0;
}
div.vertical-tabs ul.vertical-tabs-list li.selected strong,
div.vertical-tabs ul.vertical-tabs-list li.selected small {
  color: #000;
}
div.vertical-tabs ul.vertical-tabs-list .summary {
  display: block;
}
div.vertical-tabs ul.vertical-tabs ul.vertical-tabs-list .summary {
  line-height: normal;
  margin-bottom: 0;
}

/* Back-port only additions. */
div.vertical-tabs ul.vertical-tabs-list li.error {
  border:1px solid #DD7777 !important;
  background: #FFCCCC !important;
}

File

vertical_tabs.css
View source 
  1. 

  2. div.vertical-tabs {

  3.   margin: 1em 0 1em 15em;

  4.   border: 1px solid #ccc;

  5.   display: none; /** Backport only CSS **/

  6. }

  7. div.vertical-tabs ul.vertical-tabs-list {

  8.   width: 15em;

  9.   list-style: none;

  10.   list-style-image: none; /* IE6 */

  11.   border-top: 1px solid #ccc;

  12.   padding: 0;

  13.   position: relative; /* IE6 */

  14.   margin: -1px -100% -1px 0;

  15.   left: -15em;

  16.   float: left;

  17. }

  18. div.vertical-tabs .vertical-tabs-panes fieldset.vertical-tabs-pane {

  19.   margin: 0 !important;

  20.   padding: 0 1em;

  21.   border: 0;

  22. }

  23. /*div.vertical-tabs .vertical-tabs-panes fieldset.vertical-tabs-pane legend {

  24.   display: none;

  25. }*/

  26. 

  27. /* Layout of each tab */

  28. div.vertical-tabs ul.vertical-tabs-list li {

  29.   background: #eee;

  30.   border: 1px solid #ccc;

  31.   border-top: 0;

  32.   padding: 0;

  33.   margin: 0;

  34.   height: 1%;

  35. }

  36. div.vertical-tabs ul.vertical-tabs-list li a {

  37.   display: block;

  38.   text-decoration: none;

  39.   padding: 0.5em 0.6em;

  40.   line-height: 1.3em;

  41.   height: 1%;

  42. }

  43. div.vertical-tabs ul.vertical-tabs-list li a:focus {

  44.   position: relative;

  45.   z-index: 5;

  46. }

  47. div.vertical-tabs ul.vertical-tabs-list li a:hover {

  48.   text-decoration: none;

  49. }

  50. div.vertical-tabs ul.vertical-tabs-list li.selected {

  51.   background: #fff;

  52.   border-right-width: 0;

  53.   position: relative;

  54. }

  55. div.vertical-tabs ul.vertical-tabs-list li.selected a:focus {

  56.   outline: 0;

  57. }

  58. div.vertical-tabs ul.vertical-tabs-list li.selected strong,

  59. div.vertical-tabs ul.vertical-tabs-list li.selected small {

  60.   color: #000;

  61. }

  62. div.vertical-tabs ul.vertical-tabs-list .summary {

  63.   display: block;

  64. }

  65. div.vertical-tabs ul.vertical-tabs ul.vertical-tabs-list .summary {

  66.   line-height: normal;

  67.   margin-bottom: 0;

  68. }

  69. 

  70. /* Back-port only additions. */

  71. div.vertical-tabs ul.vertical-tabs-list li.error {

  72.   border:1px solid #DD7777 !important;

  73.   background: #FFCCCC !important;

  74. }