I'm using this for displaying a drop down menu. It works in all browsers except Chrome:
html is:
<ul id="menu">
<li>
<a href="#" onclick="return false;">Tasks</a>
<ul id="hiddenmen开发者_C百科u" class="add"> // this is the hidden drop down menu
<li> [.etc..] </li>
</ul>
</li>
</ul>
and here is the CSS:
ul#menu li ul.add {
background: #fff;
border: 1px solid #ccc;
cursor: pointer;
cursor: hand;
left: -9000px;
list-style: none;
margin: 0;
padding: 0;
position: absolute;
width: 150px;
}
ul#menu li:hover ul.add, ul#menu li.sfhover ul.add {
left: -81px;
top: 4px;
*top: 12px;
}
How could i make this work on chrome?
I don't know why you're using -81px
, but that moves the ul
over 81px
to the left the same way in all browsers. With that said, you should specify a position: absolute, relative, etc
to the CSS
styles.
精彩评论