posted 18 years ago
Here is a css that works
also...remember that if the last loaded css that applies to that style is the one that will present. This is important for several reasons
1. if your using multiple css that have the same definitions
2. if you have the style in the element that overrides the style this would apply to html tiag styles.
/********************************
*Tabbed Panel: Style 0*
**
*SlantActiveLeft = 0*
*SlantInactiveLeft = 0*
*SlantActiveRight = 2*
*SlantInactiveRight = 2*
********************************/
/* The table displaying all of the tabs, panels and buttons which has 3 rows, each row has one cell for all tabs, panels and buttons*/
.tabbedPanel {
/*background-color: #DCDDCC;*/
border-width: 1px;
border-style: solid;
border-color: #808080;
padding: 0px;
margin: 0px;
/*red */
color: #980000;
}
/* The Cell displaying all of the tabs*/
.tabbedPanel-Header {
border-width: 0px;
border-bottom-width: 5px;
border-style: solid;
/*border-color: navy;*/
border-color: #95A5B9;
padding: 0px;
padding-left:4px;
padding-top:4px;
margin: 0px;
/*color: #980000;*/
}
/* The table inside the tabs cell*/
.tabbedPanel-Header TABLE {
margin-right: 0px;
color: #980000;
}
/* Common style for active and inactive tabs*/
.tabbedPanel-TabActive, .tabbedPanel-TabInactive {
font-family: sans-serif;
font-size: 10pt;
font-weight: bold;
text-decoration: none;
border-width: 1px;
border-bottom-width: 0px;
border-style: solid;
border-color: #95A5B9;
padding: 1px;
padding-top: 2px;
padding-bottom: 1px;
/*red */
color: #980000;
}
/* style for active tab*/
.tabbedPanel-TabActive {
/*background-color: gold;*/
background-color: #95A5B9;
/*color: window;*/
/*red */
color: #980000;
}
/* style for inactive tab(s)*/
.tabbedPanel-TabInactive {
/*background-color: navy;
/*color: windowtext;*/
/*red */
color: #ffffff;
background-color: #E5ECF3;
/*color: windowtext;*/
/*red */
/*color: #980000;*/
}
/* style for the text in active tab*/
.tabbedPanel-HyperActive {
/*color: window;*/
/*red */
color: #980000;
text-decoration: none
}
/* style for the text in inactive tab(s)*/
.tabbedPanel-HyperInactive {
/*color: windowtext;*/
/*red */
color: #980000;
text-decoration: none
}
/* style for the panels*/
.tabbedPanel-Body {
padding: 4px;
}
/* style for the Div object which is inside the panels*/
.tabbedPanel-Body DIV {
/*background-color: #EEEEEE; */
border-width: 1px;
border-style: solid;
border-color: #808080;
}
/* style for footer cell which has all the buttons*/
.tabbedPanel-Footer {
padding:0px;
padding-bottom: 4px;
padding-right:6px;
}
/* style for the input html components inside the footer cell*/
.tabbedPanel-Footer INPUT {
margin: 0px;
margin-left: 6px;
}
/********************************
*Tabbed Panel: Style 1*
**
*SlantActiveLeft = 2*
*SlantInactiveLeft = 2*
*SlantActiveRight = 2*
*SlantInactiveRight = 2*
********************************/
.tabbedPanel_1 {
background-color: transparent;
border-width: 0px;
border-bottom-width: 1px;
border-style: "solid";
border-color: #ACACAC;
padding: 0px;
margin: 0px;
}
.tabbedPanel_1-Header {
border-width: 0px;
border-bottom-width: 1px;
border-style: solid;
border-color: #808080;
padding: 0px;
padding-top: 4px;
padding-left: 4px;
margin: 0px;
}
.tabbedPanel_1-Header TABLE {
margin-right: 5px;
}
.tabbedPanel_1-TabActive, .tabbedPanel_1-TabInactive {
font-family: sans-serif;
font-size: 10pt;
font-weight: 400;
text-decoration: none;
/*color: windowtext;*/
/*red */
color: #980000;
border-width: 1px;
border-bottom-width: 0px;
border-style: solid;
border-color: #808080;
padding: 8px;
padding-top: 0px;
padding-bottom: 0px;
text-align: center;
}
.tabbedPanel_1-TabActive {
border-color: #808080;
border-bottom-color: #D4D0C8;
background-color: #D4D0C8;
}
.tabbedPanel_1-TabInactive {
border-color: #808080;
background-color:#ACACAA;
}
.tabbedPanel_1-HyperActive {
/*color: windowtext;*/
/*red */
color: #980000;
text-decoration: none;
}
.tabbedPanel_1-HyperInactive {
/*color: windowtext;*/
/*red */
color: #980000;
text-decoration: none;
}
.tabbedPanel_1-Body {
background-color: #D4D0C8;
border-width: 1px;
border-top-width: 0px;
border-bottom-width: 0px;
border-style: solid;
border-color: #ACACAC;
padding: 4px;
}
.tabbedPanel_1-Footer {
border-color: #ACACAC;
border-style: solid;
border-width: 1px;
border-top-width: 0px;
padding: 8px;
background-color: #D4D0C8;
}
.tabbedPanel_1-Footer INPUT {
margin: 0px;
margin-left: 6px;
}
/********************************
*Tabbed Panel: Style 2*
**
*SlantActiveLeft = 0*
*SlantInactiveLeft = 0*
*SlantActiveRight = 4*
*SlantInactiveRight = 0*
********************************/
.tabbedPanel_2 {
background-color: transparent;
border-width: 0px;
padding: 0px;
margin: 0px;
}
.tabbedPanel_2-Header {
border-width: 0px;
border-bottom-width: 3px;
border-style: solid;
border-color: #7D95B3;
padding: 0px;
padding-top: 4px;
padding-left: 8px;
margin: 0px;
}
.tabbedPanel_2-Header TABLE {
margin-right: 2px;
}
.tabbedPanel_2-TabActive, .tabbedPanel_2-TabInactive {
font-family: sans-serif;
font-size: 10pt;
text-decoration: none;
border-width: 1px;
border-style: solid;
border-color: #808080;
padding-left: 8px;
padding-right: 2px;
padding-top: 2px;
padding-bottom: 1px;
}
.tabbedPanel_2-TabActive {
background-color: #7D95B3;
border-color: #7D95B3;
/*
color: window;*/
/*red */
color: #980000;
font-weight: bold;
}
.tabbedPanel_2-TabInactive {
background-color: #DEDEDE;
border-color: #D4D4D4;
/*
color: windowtext;*/
/*red */
color: #980000;
font-weight: 400;
}
.tabbedPanel_2-HyperActive {
/*color: window;/*
/*red */
color: #980000;
text-decoration: none
}
.tabbedPanel_2-HyperInactive {
/*color: windowtext;*/
/*red */
color: #980000;
text-decoration: none
}
.tabbedPanel_2-Body {
background-color: transparent;
border-width: 2px;
border-top-width: 0px;
border-style: solid;
border-color: #7D95B3;
padding: 4px;
}
.tabbedPanel_2-Footer {
padding:8px;
}
.tabbedPanel_2-Footer INPUT {
margin: 0px;
margin-left: 6px;
}
/********************************
*Tabbed Panel: Style 3*
**
*SlantActiveLeft = 0*
*SlantInactiveLeft = 0*
*SlantActiveRight = 0*
*SlantInactiveRight = 0*
********************************/
.tabbedPanel_3 {
background-color: transparent;
border-width: 0px;
padding: 0px;
margin: 0px;
}
.tabbedPanel_3-Header {
border-width: 0px;
border-bottom-width: 3px;
border-style: solid;
border-color: #7D95B3;
padding: 0px;
padding-top: 4px;
padding-left: 8px;
margin: 0px;
}
.tabbedPanel_3-Header TABLE {
margin-right: 2px
}
.tabbedPanel_3-TabActive, .tabbedPanel_3-TabInactive {
font-family: sans-serif;
font-size: 10pt;
text-decoration: none;
border-width: 0px;
border-bottom-width: 2px;
border-style: solid;
padding: 5px;
padding-top: 3px;
padding-bottom: 3px;
}
.tabbedPanel_3-TabActive {
background-color: #7D95B3;
border-color: #7D95B3;
/*color: window;*/
/*red */
color: #980000;
font-weight: bold;
}
.tabbedPanel_3-TabInactive {
background-color:#DEDEDE;
border-color: window;
/*color: windowtext;*/
/*red */
color: #980000;
font-weight: 400;
}
.tabbedPanel_3-HyperActive {
/*color: window;*/
/*red */
color: #980000;
text-decoration: none;
}
.tabbedPanel_3-HyperInactive {
/*color: windowtext;*/
/*red */
color: #980000;
text-decoration: none;
}
.tabbedPanel_3-Body {
background-color: transparent;
border-width: 0px;
padding: 4px;
}
.tabbedPanel_3-Footer {
}
.tabbedPanel_3-Footer INPUT {
margin: 0px;
margin-left: 6px;
}
Surround yourself with learners...They will educate you!