# Drop Down menu

**URL:** <https://forum.kirupa.com/t/drop-down-menu/201286>\
**Category:** web dev\
**Created:** [September 20, 2006, 2:10am UTC](https://forum.kirupa.com/t/drop-down-menu/201286 "2006-09-20T02:10:36Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![cokelatdesign](https://avatars.discourse-cdn.com/v4/letter/c/7c8e57/32.png) [@cokelatdesign](https://forum.kirupa.com/u/cokelatdesign)\
**Post date:** [September 20, 2006, 2:10am UTC](https://forum.kirupa.com/t/drop-down-menu/201286/1 "2006-09-20T02:10:36Z")

</div>

hi guys I have a problem,

I want to create drop down menu, below are the code:  
\<link href=“menu\_style.css” type=“text/css”\>  
\<div id=“menu”\>  
\<ul\>  
\<li\>\<a href=“home.htm”\>Home\</a\>\</li\>  
\<li\>\<a href="" class=“dissapear”\>3D\</a\>  
\<ul class=“submenu”\>  
\<li\>\<a href=“3d\_cg\_animation.htm”\>CG Animation\</a\>\</li\>  
\<li\>\<a href=“3d\_stop\_motion.htm”\>Stop Motion\</a\>\</li\>  
\<li\>\<a href=“3d\_illustration.htm”\>Illustrations\</a\>\</li\>  
\<li\>\<a href=“3d\_animated\_films.htm”\>Animated Films\</a\>\</li\>  
\<li\>\<a href=“3d\_foam\_sculpture.htm”\>Foam Sculpture\</a\>\</li\>  
\<li\>\<a href=“3d\_lenticular\_printing.htm”\>Lenticular Printing\</a\>\</li\>  
\</ul\>  
\</li\>  
\<li\>\<a href=“associates.htm”\>Associates\</a\>\</li\>  
\<li\>\<a href=“client\_list.htm”\>Client List\</a\>\</li\>  
\<li\>\<a href=“testimonials.htm”\>Testimonials\</a\>\</li\>  
\<li\>\<a href=“press.htm”\>Press\</a\>\</li\>  
\<li\>\<a href=“contact.htm”\>Contact\</a\>\</li\>  
\<li\>\<a href=“faq.htm”\>FAQ\</a\>\</li\>  
\<li\>\<a href=“fun\_stuff.htm”\>Fun Stuff\</a\>\</li\>  
\</ul\>  
\</div\>  
and the css are:  
#menu{  
font-family:“century gothic”;  
font-size:11pt;  
color:#000;  
text-decoration:none;  
width:1024px;  
position:relative;  
padding:0;  
margin:0;  
z-index:10;  
}  
#menu ul li a, #menu ul li a:visited{  
color:#000;  
text-decoration:none;  
display:block;  
width:110px;  
height:20px;  
text-align:center;  
line-height:20px;  
overflow:hidden;

}  
#menu ul li:hover ul.submenu a{  
text-align:left;  
margin:0;  
width:115px;  
height:20px;  
padding:0;  
}  
#menu ul{  
padding:0;  
margin:0;  
list-style-type:none;  
}  
#menu ul li{  
float:left;  
margin:0px;  
padding:0px;  
position:relative;  
}  
#menu ul li ul{  
font-family:“century gothic”;  
font-size:10pt;  
display:none;  
}

#menu ul li a:hover{  
color:#fff;  
}  
#menu ul li:hover ul{  
margin:0px;  
padding:0 1px;  
border-width:0 1px 1px 1px;  
border-style:solid;  
border-color:#999;  
display:block;  
position:absolute;

}  
#menu ul li:hover ul li a:hover{  
background-color:#999;  
color:#fff;

}

when i test it in my MAC computer it’s worked but when i test it in PC the submenu doesn;t come out,

can anyone help me

thx
