PDA

View Full Version : tabcontent - problem with weird red block



doorock42
02-29-2008, 08:06 PM
1) Script Title:
tabcontent

2) Script URL (on DD):
http://www.dynamicdrive.com/dynamicindex17/tabcontent.htm

3) Describe problem:
http://www.11alive.com/specials/widgets/news_widget.aspx

I'm using tabcontent to put three areas of content in a new widget. For some reason, there's a red bar to the right of the selected tabs. I've been over my code many times and have not been able to figure out why this is occurring. Please help.

Here is the code for the tabs:

<ul id="maintab" class="shadetabs">
<li class="selected"><a href="#" rel="tcontent1"><span class="travtexta">News</span></a></li>
<li><a href="#" rel="tcontent2"><span class="travtexta">Sports</span></a></li>
<li><a href="#" rel="tcontent3"><span class="travtexta">Dude, What?</span></a></li>
</ul>

Here is the CSS that goes along with it:

.shadetabs{
padding: 2px 0;
margin-left: 0;
margin-top: 1px;
margin-bottom: 0;
font: bold 9px arial;
list-style-type: none;
text-align: left; /*set to left, center, or right to align the menu as desired*/
}

.travtexta {
font-family: arial;
font-size: 10px!important;
font-weight: bold;
}

.shadetabs li{
display: inline;
margin: 0;
}

.shadetabs li a{
text-decoration: none;
padding: 3px 7px;
margin-right: 3px;
border: 1px solid #778;
color: #2d2b2b;
background: white url(/travel/shade.gif) top left repeat-x;
}

.shadetabs li a:visited{
color: #2d2b2b;
}

.shadetabs li a:hover{
text-decoration: underline;
color: #2d2b2b;
}

.shadetabs li.selected{
position: relative;
top: 1px;
}

.shadetabs li.selected a{ /*selected main tab style */
background-image: url(/travel/shadeactive.gif);
border-bottom-color: white;
}

.shadetabs li.selected a:hover{ /*selected main tab style */
text-decoration: none;
}

I'm sure it's something really simple that I'm completely missing. Please help. Thank you.

ddadmin
02-29-2008, 09:26 PM
I've narrowed it down to something within wxia3.css. If I disable that stylesheet, the red block disappears. Try looking in there for the culprit.

doorock42
02-29-2008, 09:31 PM
I've narrowed it down to something within wxia3.css. If I disable that stylesheet, the red block disappears. Try looking in there for the culprit.

That did it. I pulled out the one style I needed and that did it.

Thank you.