Chrome CSS Drop Down, where to set the height?

[student101]

-------------
Script: Chrome CSS Drop Down Menu (v2.5)
http://www.dynamicdrive.com/dynamici...rome/index.htm

Please see attached image;

How to:
... set the height to 30px or any size in pixels?
... line up the lines from top-menu to sub-menu?
... clear the little gap on the left?
... stop the overlap of the sub-menu?
... fill the entire top-menu item, like the sub-menu?
-------------

Regards,
Cheers

[ddadmin]

Hmm the screenshot you posted doesn't look like Chrome Menu actually. Are you referring to a different script?

[student101]

No, it's a modified database driven version of Chrome CSS Drop Down Menu (v2.5)
Here is the CSS; I've attempted to set the height with no luck, I think this script works with images and or font sizing for that?

* html .dropmenudiv a{ /*IE only hack*/
    width: 100%;
}
.chromestyle{
    width: auto;/*99%;*/
    /*font-weight: bold;*/
    /*height: 30px;*/
}
.chromestyle:after{ /*Add margin between menu and rest of content in Firefox*/
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
    /*height: 30px;*/
}
.chromestyle ul{
    /*border: 1px solid #fff;*/
    width: 100%;
    background: #6B804D; /*THEME CHANGE HERE*/
    padding: 4px 0;
    margin: 0;
    text-align: left; /*set value to "left", "center", or "right"*/
    /*height: 30px;*/
}
.chromestyle ul li{
    display: inline;
    /*height: 30px;*/
}
.chromestyle ul li a{
    color: #fff;
    padding: 4px 6px;
    margin: 0;
    text-decoration: none;
    border-right: 1px solid #fff; /*THEME CHANGE HERE*/
    /*height: 30px;*/
}
.chromestyle ul li a:hover, .chromestyle ul li a.selected{ /*script dynamically adds a class of "selected" to the current active menu item*/
    background: #6F9933; /*THEME CHANGE HERE*/
    /*height: 30px;*/
}
/* ######### Style for Drop Down Menu ######### */

.dropmenudiv{
    position:absolute;
    top: 0;
    left: 0;
    font:normal 12px Verdana;
    line-height:18px;
    z-index:100;
    background-color: #6B804D;
    width: 200px;
    visibility: hidden;
    /*border-width: 0px;*/
    /*height: 30px;*/
}
.dropmenudiv a{
    width: 100%;
    display: block;
    text-indent: 3px; /*THEME CHANGE HERE*/
    padding: 2px 0;
    text-decoration: none;
    /*font-weight: bold;*/
    color: #fff;
    border-top: 0px solid #fff;
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;
    border-left: 1px solid #fff;
    /*height: 30px;*/
}

.dropmenudiv a:hover{ /*THEME CHANGE HERE*/
    background: #6F9933;
    /*height: 30px;*/
} 

Anyone able to assist?

[student101]

Has this menu updated?

I would really like to get the idea off the ground, the javascript seems to be causing issues with the changes that I need.