I have a code that says:
Expand|Select|Wrap|Line Numbers
- <DIV CLASS ="SLIDETABS">
- <ul id="solutionstabs" class="tabs">
- <li ><a href="#" title="Solution Overviews" rel="solutions1" ><span>Solution Overviews</span></a></li>
- <li ><a href="#" title="Implementation Accelerators" rel="solutions2" ><span>Implementation Accelerators</span></a></li>
- <li ><a href="#" title="Customer Success Stories" rel="solutions3" ><span>Customer Success Stories</span></a></li>
- </ul></DIV>
Both classes are on the same style sheet...please help...
----my style sheet:
Expand|Select|Wrap|Line Numbers
- #slidetabsmenu {
- float:left;
- width:100%;
- margin-left: 0;
- line-height:25px;
- border-bottom: 0px solid gray;
- font: bold 12px Verdana;
- }
- * html #slidetabsmenu{ /*IE only. Add 1em spacing between menu and rest of content*/
- margin-bottom: 0em;
- }
- #slidetabsmenu ul{
- float:left;
- list-style-type: none;
- margin:0;
- margin-left: 0px;
- padding:0;
- }
- #slidetabsmenu li{
- float:left;
- display:inline;
- margin:0;
- padding:0;
- }
- #slidetabsmenu a {
- float:left;
- background:url(images/tab-left.gif) no-repeat left top;
- margin:0;
- padding:0 0 0 9px;
- text-decoration:none;
- }
- #slidetabsmenu a span {
- float:left;
- display:block;
- background:url(images/tab-right.gif) no-repeat right top;
- padding:3px 14px 3px 5px;
- font-weight:bold;
- color:#3B3B3B;
- }
- /* Commented Backslash Hack hides rule from IE5-Mac \*/
- #slidetabsmenu a span {float:none;}
- /* End IE5-Mac hack */
- #slidetabsmenu a:hover span {
- color: black;
- }
- #slidetabsmenu #current a {
- background-position:0 -125px;
- }
- #slidetabsmenu #current a span {
- background-position:100% -125px;
- color: red;
- }
- #slidetabsmenu a:hover {
- background-position:0% -125px;
- }
- #slidetabsmenu a:hover span {
- background-position:100% -125px;
- }
- /* ######### CSS for metashade Tabs. Remove if not using ######### */
- .tabs{
- /*padding: 3px 0;*/
- margin-left: 0;
- margin-top: 0;
- margin-bottom: 0;
- list-style-type: none;
- text-align: left;
- font-size:12px;
- width:100%;
- line-height:25px;
- }
- .tabs li{
- float:left;
- margin-bottom: 0;
- padding: 0;
- margin-left: 0px;
- display:inline;
- text-align: left;
- line-height:25px;
- }
- .tabs ul{
- float:left;
- list-style-type: none;
- margin:0;
- margin-left: 0px;
- padding:0;
- text-align: left;
- line-height:25px;
- }
- .tabs li a{
- float:left;
- text-decoration: none;
- margin-bottom: 0;
- padding:3px 14px 3px 5px;
- font:bold;
- text-align: left;
- color: #2d2b2b;
- background:url(images/tab-right.gif) no-repeat right top;
- border-bottom-color: white;
- line-height:25px;
- }
- .tabs li a:visited{
- color: #2d2b2b;
- text-align: left;
- }
- .tabs li a:hover{
- float:left;
- text-decoration: none;
- background:white;
- }
- .tabs li a.selected{ /*selected main tab style */
- float:left;
- border-bottom-color: white;
- background:white ;
- text-align: left;
- }
- .tabs li a.selected:hover{ /*selected main tab style */
- text-decoration: none;
- }
- .tabcontent{
- display:none;
- }
- @media print {
- .tabcontent {
- display:block !important;
- }
- }
- /* ######### CSS for Inverted Modern Bricks II Tabs. Remove if not using ######### */
- .modernbricksmenu2{
- padding: 0;
- width: 362px;
- border-top: 5px solid #D25A0B; /*Brown color theme*/
- background: transparent;
- voice-family: "\"}\"";
- voice-family: inherit;
- }
- .modernbricksmenu2 ul{
- margin:0;
- margin-left: 10px; /*margin between first menu item and left browser edge*/
- padding: 0;
- list-style: none;
- }
- .modernbricksmenu2 li{
- display: inline;
- margin: 0 2px 0 0;
- padding: 0;
- text-transform:uppercase;
- }
- .modernbricksmenu2 a{
- float: left;
- display: block;
- font: bold 11px Arial;
- color: white;
- text-decoration: none;
- margin: 0 1px 0 0; /*Margin between each menu item*/
- padding: 5px 10px;
- background-color: black; /*Brown color theme*/
- border-top: 1px solid white;
- }
- .modernbricksmenu2 a:hover{
- background-color: #D25A0B; /*Brown color theme*/
- color: white;
- }
- .modernbricksmenu2 a.selected{ /*currently selected tab*/
- background-color: #D25A0B; /*Brown color theme*/
- color: white;
- border-color: #D25A0B; /*Brown color theme*/
- }
- .tabcontent{
- display:none;
- }
- @media print {
- .tabcontent {
- display:block !important;
- }
- }
- /* ######### CSS for Indented CSS Tabs. Remove if not using ######### */
- .indentmenu{
- font: bold 13px Arial;
- width: 100%; /*leave this value as is in most cases*/
- }
- .indentmenu ul{
- margin: 0;
- padding: 0;
- float: left;
- /* width: 80%; width of menu*/
- border-top: 1px solid navy; /*navy border*/
- background: black url(indentbg.gif) center center repeat-x;
- }
- .indentmenu ul li{
- display: inline;
- }
- .indentmenu ul li a{
- float: left;
- color: white; /*text color*/
- padding: 5px 11px;
- text-decoration: none;
- border-right: 1px solid navy; /*navy divider between menu items*/
- }
- .indentmenu ul li a:visited{
- color: white;
- }
- .indentmenu ul li a.selected{
- color: white !important;
- padding-top: 6px; /*shift text down 1px*/
- padding-bottom: 4px;
- background: black url(indentbg2.gif) center center repeat-x;
- }
- .tabcontentstyle{ /*style of tab content oontainer*/
- border: 1px solid gray;
- width: 450px;
- margin-bottom: 1em;
- padding: 10px;
- }
- .tabcontent{
- display:none;
- }
- @media print {
- .tabcontent {
- display:block !important;
- }
- }