1 reply [Last post]
Johneh
Offline
newbie
Cornwall England
Last seen: 13 years 50 weeks ago
Cornwall England
Joined: 2008-02-15
Posts: 2
Points: 0

Herrow! first post on here - hope someone can help me out.

what i've got is a menu using ul, styled through CSS to include a drop down list. found the article on a list apart and nicked the code.

it uses a jot of javascript for ie5-6 but it doesn't seem to be working in ie7.

http://www.nextstep-cds.org.uk

HTML:

CSS:

#nav ul {
font: normal 11px verdana;
margin: 0;
padding: 0;
list-style: none;
width: 250px; /* Width of Menu Items */
border-bottom: 1px solid #ccc;
}

#nav ul li {
position: relative;
}

#nav li ul {
position: absolute;
left: 249px; /* Set 1px less than menu width */
top: 0;
display: none;
}

/* Styles for Menu Items */
#nav ul li a {
display: block;
text-decoration: none;
color: #00a1a1;
background: #fff; /* IE6 Bug */
padding: 5px;
border: 1px solid #ccc; /* IE6 Bug */
border-bottom: 0;
}

/* Holly Hack. IE Requirement \*/
* html #nav ul li { float: left; height: 1%; }
* html #nav ul li a { height: 1%; }
/* End */

#nav ul li a:hover { color: #E2144A; background: #ececec; } /* Hover Styles */

/*-----------------------------------------------------------------------------------*/

#menu1 li:hover ul, #menu1 li.over ul { display: block; } /* The magic */

Javascript:

startList = function() {
if (document.all&&document.getElementById) {
navRoot = document.getElementById("menu1");
for (i=0; i

Johneh
Offline
newbie
Cornwall England
Last seen: 13 years 50 weeks ago
Cornwall England
Joined: 2008-02-15
Posts: 2
Points: 0

Figured it out now, needed

Figured it out now, needed to add a background colour to #menu1 li:hover ul, #menu1 li.over ul { display: block; } /* The magic */

Smile