tab menu | IE vs Mozilla

[bozhevenok]

Hello,
I am trying to create tab menu.

Here is the example: http://buphy.bu.edu/~asp/Ira/tabmenu.htm

For some reason the “products” in the menu is not highlighted in Explorer when selected. I.e. the explorer seems not to recognize the “selected” attribute. Mozilla and Netscape work fine.

Another problem is that I need to make a white line under the selected nav bar item in the selected stage.

Here is my html:
<ul id="maintab" class="shadetabs">
<li id="products" class="selected"><a href="#default" rel="ajaxcontentarea">Products</a></li>
<li id="overview"><a href="tab_overview.htm" rel="ajaxcontentarea">Overview</a></li>
<li id="staff"><a href="tab_staff.htm" rel="ajaxcontentarea">Cool Stuff</a></li>
<li id="download"><a href="tab_download.htm" rel="ajaxcontentarea">Downloads</a></li>
</ul>
<div id="ajaxcontentarea" class="contentstyle"><center><br>
test test<br></center>
</div>

Here is my css:
.shadetabs
{
width:580px;
height: 35px;
padding: 0;
margin: 0;
}

.shadetabs ul
{
list-style: none;
padding: 0;
margin: 0;
width: 580px;
height: 35px;
}

.shadetabs li
{
float: left;
margin: 0px 0px;
list-style: none;
display: inline;
text-align: center;
}

.shadetabs li a, .shadetabs li a:visited
{
background: url(img/tabbed_overview_off.jpg) no-repeat;
height: 35px;
line-height: 35px;
float: left;
width: 145px;
display: block;
color: #2A3236;
text-decoration: none;
text-align: center;
}

.shadetabs li a:hover
{
background: url(img/tabbed_overview_on.jpg) no-repeat;
}

.shadetabs li#products, .shadetabs li#products a, .shadetabs li#products a:visited{
background: url(img/tabbed_products_off.jpg) no-repeat;
}

.shadetabs li#products a:hover{
background: url(img/tabbed_products_on.jpg) no-repeat;
}

.shadetabs li#overview, .shadetabs li#overview a, .shadetabs li#overview a:visited{
background: url(img/tabbed_overview_off.jpg) no-repeat;
}

.shadetabs li#overview a:hover{
background: url(img/tabbed_overview_on.jpg) no-repeat;
}

.shadetabs li#staff, .shadetabs li#staff a, .shadetabs li#staff a:visited{
background: url(img/tabbed_staff_off.jpg) no-repeat;
}

.shadetabs li#staff a:hover{
background: url(img/tabbed_staff_on.jpg) no-repeat;
}

.shadetabs li#download, .shadetabs li#download a, .shadetabs li#download a:visited {
background: url(img/tabbed_download_off.jpg) no-repeat;
}

.shadetabs li#download a:hover{
background: url(img/tabbed_download_on.jpg) no-repeat;
}

.shadetabs li.selected, .shadetabs li.selected a, .shadetabs li.selected a:hover {
background: url(img/tabbed_overview_vis.jpg) no-repeat;
}

.shadetabs li.selected#products, .shadetabs li.selected#products a, .shadetabs li.selected#products a:hover {
background: url(img/tabbed_products_vis.jpg) no-repeat;
}

.shadetabs li.selected#overview, .shadetabs li.selected#overview a, .shadetabs li.selected#overview a:hover {
background: url(img/tabbed_overview_vis.jpg) no-repeat;
}

.shadetabs li.selected#staff, .shadetabs li.selected#staff a, .shadetabs li.selected#staff a:hover {
background: url(img/tabbed_staff_vis.jpg) no-repeat;
}

.shadetabs li.selected#download, .shadetabs li.selected#download a, .shadetabs li.selected#download a:hover {
background: url(img/tabbed_download_vis.jpg) no-repeat;
}

.contentstyle{
background:url(img/bg_tabbed.jpg);
border: 1px;
border-color: #A4A8AB;
border-style:solid;
display:block;
width: 580px;
}

Thanks a lot!