Drop down menu - Programmers Heaven

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!


Welcome to the new platform of Programmer's Heaven! We apologize for the inconvenience caused, if you visited us from a broken link of the previous version. The main reason to move to a new platform is to provide more effective and collaborative experience to you all. Please feel free to experience the new platform and use its exciting features. Contact us for any issue that you need to get clarified. We are more than happy to help you.

Drop down menu


I am trying to create a drop-down menu for a website I am developing for my school. I found some hints on the web and am doing this menu using style sheets. However, I have a problem: It works OK on my home computer but doesn't work on the school computers. When I hover over the menu items the menu does not appear. Does anyone have any idea why, please?

This is the code I used ...

The html code:
The following is the CSS code:
margin: 0;
padding: 0;
list-style: none;
width: 115px; /* Width of Menu Items */

ul li{
position: relative;

li ul {
position: absolute;
left: 0px;
bottom:35px /* Set 1px less than menu width */
top: 0;
display: none;

/* Styles for Menu Items */
ul li a {
border-left:1px solid #066; border-right:1px solid #066; border-top:1px solid #066; display: block;
text-decoration: none;
background: #A0C7C6; /* IE6 Bug */
padding: 5px;
border-bottom: 0px none;

/* Fix IE. Hide from IE Mac */
* html ul li { float: left; bottom; height: 1% }
* html ul li a { height: 1%; }
/* End */

ul li a:hover { color: #E2144A; background: #AOC7C6; }/*Hover Styles*/
li ul li a { padding: 2px 5px; } /* Sub Menu Styles */
li:hover ul, li.over ul { display: block;}

Thank you!!


Sign In or Register to comment.