...

View Full Version : Suckerfish positioning problem IE6



batuhanu
01-10-2010, 10:08 AM
Hi everyone,

I really need your precious help,

I'm using a css:hover fix based on including a csshover htc file to my css as suckerfish solution in ie6.

The problem is when I hover the buttons in any browser, the menus appear directly under the button (which I want to have) however in ie6, the menus appear at the right end of the menu.

Any help will be appreciated.

Thanks!!

problem:
http://i49.tinypic.com/2db2hrk.png


<div id="tabs">
<ul id="menu">
<li></li>
<li><a href="#"><span>Home</span></a>
<ul>
<li><a href="#">Submenu 3.1</a></li>
<li><a href="#">Submenu 3.2</a></li>
<li><a href="#">Submenu 3.3</a></li>
</ul>
</li>
<li><a href="#"><span>About</span></a></li>
<li><a href="#"><span>Research</span></a>
<ul>
<li><a href="#">Submenu 3.1</a></li>
<li><a href="#">Submenu 3.2</a></li>
<li><a href="#">Submenu 3.3</a></li>
</ul>
</li>
<li><a href="#"><span>Facilities</span></a></li>
<li><a href="#"><span>Projects</span></a></li>
<li><a href="#"><span>People</span></a></li>
<li><a href="#"><span>Publications</span></a></li>
<li><a href="#"><span>Events</span></a></li>
<li><img id="tabRightFooter" src="images/footer_right.gif"></li>
</ul>
</div>







#menu {
font-size:9pt;
font-weight:bold;
line-height:39px;
margin:131px 0 0 223px;
margin-bottom:0px; /*margin between menu and rest of page*/

}

#menu ul {
margin:0;
padding:0px 0px 0px 0px;
list-style:none;
}

#menu li {
display:inline;
margin:0;
}

#menu li.active {
margin:0;
float:left;
padding:1px 15px 8px 15px;
background:url("../images/footer.gif") repeat left top;
color:#FFF;
background-position:0% -48px;
}
#menu a {
float:left;
background:url("../images/footer.gif") no-repeat left top;
margin:0;
padding:0 0 0 0px;
text-decoration:none;
}



#menu a span {
float:left;
display:block;
background:url("../images/footer.gif") repeat right top;
padding:1px 15px 8px 15px;
margin-right:0px;
color:#FFF;
}

/* Commented Backslash Hack hides rule from IE5-Mac \*/
#menu a span {float:none;}

/* End IE5-Mac hack */
#menu a:hover span {
}

#menu a:hover {
background-position:0% -48px;
}

#menu a:hover span {
background-position:100% -48px;
}
* html .nav a { height: 1%; }

#menu li ul {
position: absolute;
width: 100px;
z-index: 50; /* show the dropdowns above the images */
top: 170px; /* position the dropdowns a set distance from the top of the image */
left: -999em;
list-style: none;


}

#menu li:hover ul { left:auto }

#menu li li {
height: auto; /* reset the height and padding set on the IR list items */
width:auto;
padding-bottom: 0;
font-size: 110%;
border-bottom: 1px solid #FFCC00;
}

#menu li ul a {
padding: 0.25em;
color: #FF6600;
background: #FFFFCC;
}
#menu li ul a:hover {
color: #FFFFFF;
background: #448EB7;
}

abduraooft
01-10-2010, 11:56 AM
Any help will be appreciated. Can we have a link to your page?



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum