Drop Down HTML Control

[Elbee]

1) Script Title: Drop Down HTML Control

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...owncontrol.htm

3)Author: Ilya S. Lyubinskiy

4) Describe problem:


1. How do I indicate that I want the drop down menu items a smaller font than the title of the menu?

2. Once I removed the javascript:alert and replaced it with a link on the About the Library menu item, it no longer changes color while the mouse hovers over it. It is the only list item that does not change colors when hovering. I'm attaching an image.

This is the CSS code:
<style type="text/css">
body { font-size: 0.7em; }
h3 { font-size: 1.6em; margin: 0px; }

a.sample_attach, a.sample_attach:visited, div.sample_attach
{
display: block;
width: 190px;

border: 1px solid black;
padding: 2px 5px;

background: #FFFFEE;

text-decoration: none;
font-family: Arial, Sans-Sherif;
font-weight: bold;
font-size: 13px;
color: #008000;
}

a.sample_attach, a.sample_attach:visited { border-bottom: none; }
div#sample_attach_menu_child { border-bottom: 1px solid black; }

</style>

3. I want three of these menus in a horizontal row. Would I just repeat all of the code and give the second and third menus a different name? Also, would I repeat the function in the dropdown.js file with two other names for the additional menus? I have attached an image of what I am trying to create.

Thanks for your help, Elbee