Log in

View Full Version : IE 6 Ajax Tabs deplay at bottom of the page



kemoche
03-31-2009, 06:19 AM
Hi, am new here :confused: - am using Ajax Tabs on my joomla cms site - www.worldspansystems.co.ke/demo. The Ajaxtabs on firefox and opera are showing correctly ie the top of the page position. With IE 6.0, the same Ajax Tabs are displayed at the bottom of the page - below all the menu items which is very frustrating.
Please help me get this sorted our ASAP.

The page css is


.orthopal_tab {
width:95%;
}
.orthopaltab_date{
width:10%;
display:inline;
float:left;
}

.orthopaltab_content{
width:80%;
float:left;
border-left:1px dotted #666666;
padding-left:4px;
}

.shadetabs{
float:left;
width:90%;
background:#c1c1c1 url("bg.gif") repeat-x bottom;DAE0D2
font-size:90%;
line-height:normal;
list-style-type: none;
color:#000;
text-align: left; /*set to left, center, or right to align the menu as desired*/
}

.shadetabs ul {
margin:0;
padding:10px 10px 0;
list-style:none;
list-style-type:none;
}


.shadetabs a{
display:block;
/*background:url("norm_right.gif") no-repeat right top;
background:url("right.gif") no-repeat right top;*/
background:url("left.gif") no-repeat left top;
float:left;
padding:5px 15px 4px 6px;
text-decoration:none;
font-weight:bold;
color: #666;
}
/* Commented Backslash Hack
hides rule from IE5-Mac \*/
.shadetabs a {float:none;}
/* End IE5-Mac hack */

.shadetabs li{
float:left;
background:url("left.gif") no-repeat left top;
margin:0;
padding:0 0 0 9px;
}

.shadetabs li a{
display:block;
background:url("right.gif") no-repeat right top;
padding:5px 15px 4px 6px;
}

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

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

.shadetabs #current {
background-image:url("left_on.gif");
}

.shadetabs #current a {
background-image:url("right_on.gif");
padding-bottom:5px;
}

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

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

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

.contentstyle{
border: 1px solid gray;
width: 92%;
margin-bottom: 1em;
padding: 10px;
margin-left:0px;
}
This is only happening on IE 6.0!