SCConline
09-11-2007, 08:50 PM
Open this webpage (http://www.freewebs.com/stanlychurch/) in Internet Explorer. Now, navigate the CSS menu on the left-hand side. Mouseover "About Us," then attempt to scroll over one of the sub-menus that come up.
Having trouble? The menus disappear after the mouse is moved slightly, and often times it is impossible to even get the sub-menus to highlight. Can anyone help me with the CSS coding? I believe there is a bug with IE that doesn't allow the sub-menus to be navigated, but I don't know what. It works in Mozilla, Opera, and other browsers.
BODY {font-family:"arial narrow" "arial" "helvitica"; font-size:12; margin-left:50px; padding:0px; padding-top:0px}
P {font-family:"arial narrow"; font-size:12;}
ul {
margin: 0;
padding: 0;
list-style: none;
width: 150px;
}
ul li {
position: relative;
}
li ul {
position: absolute;
left: 149px;
top: 0;
display: none;
}
ul li a {
display: block;
text-decoration: none;
color: #777;
background: transparent;
padding: 5px;
border: 0px solid #ccc;
border-bottom: 0px;
}
ul li a:hover{color:#777;
background:#eff6f8}
/* Fix IE. Hide from IE Mac \*/
* html ul li { float: left; height: 1%; }
* html ul li a { height: 1%; }
/* End */
ul {
margin: 0;
padding: 0;
list-style: none;
width: 150px;
border-bottom: 0px solid #ccc;
}
li:hover ul, li.over ul { display: block; }
#nave-menu{
width:30em
}
There is the CSS coding ("View Source" for HTML part of webpage), can anyone help fix this bug?
Having trouble? The menus disappear after the mouse is moved slightly, and often times it is impossible to even get the sub-menus to highlight. Can anyone help me with the CSS coding? I believe there is a bug with IE that doesn't allow the sub-menus to be navigated, but I don't know what. It works in Mozilla, Opera, and other browsers.
BODY {font-family:"arial narrow" "arial" "helvitica"; font-size:12; margin-left:50px; padding:0px; padding-top:0px}
P {font-family:"arial narrow"; font-size:12;}
ul {
margin: 0;
padding: 0;
list-style: none;
width: 150px;
}
ul li {
position: relative;
}
li ul {
position: absolute;
left: 149px;
top: 0;
display: none;
}
ul li a {
display: block;
text-decoration: none;
color: #777;
background: transparent;
padding: 5px;
border: 0px solid #ccc;
border-bottom: 0px;
}
ul li a:hover{color:#777;
background:#eff6f8}
/* Fix IE. Hide from IE Mac \*/
* html ul li { float: left; height: 1%; }
* html ul li a { height: 1%; }
/* End */
ul {
margin: 0;
padding: 0;
list-style: none;
width: 150px;
border-bottom: 0px solid #ccc;
}
li:hover ul, li.over ul { display: block; }
#nave-menu{
width:30em
}
There is the CSS coding ("View Source" for HTML part of webpage), can anyone help fix this bug?