Drop Down Menu Issue

New to Javascript and been reading a lot of tutorials on the various things im trying to do with my website. One thing i cant figure out is my my menu doesnt dropdown as I want to have sublinks. I know this all has to do with my style.css. Here is the code I have, cant figure out where I got this wrong.

[CODE]
.menu {width:100%; height:67px; background:url(images/tail-menu.gif) 0 0 repeat-x #f00;}
.menu li {float:left; font-size:1.333em; line-height:1.5em; text-transform:uppercase;}
.menu li a {display:block; padding:21px 27px 22px 27px; color:#818080;}
.menu li .active, .menu li a:hover {color:#fffefe; background:#f31301;}
.menu .last-item a {padding:21px 32px 22px 27px; }
.menu li span {width:100%; height:67px; background:url(images/tail-menu.gif); no-repeat center top;float: left}
.menu li span.subhover {background-position: center bottom; cursor: pointer;}
.menu li ul.subnav {list-style: none; position: absolute; left:0; top:35px; background:#f31301; margin:0; padding:0; width:170px;float:left; display:none; border: 1px solid #111}
.menu li ul.subnav li{margin:0; padding:0; border-top: 1px solid #252525; border-bottom: 1px solid #444; clear: both; width: 100%;}
[CODE]

Any help is greatly appreciated.

Not to ask a silly question, but...

What does this have to do with JavaScript?

That's just CSS (and, implicitly, the HTML that it is designed to support).

And in any case, that CSS is kind of meaningless without seeing the HTML that, indeed, is is designed to support.