After trying several guides on creating sub-menus, some involving JS, I decided to attempt a CSS-only approach. Unfortunately, I have encountered difficulty in making the submenu function correctly.
You can view my code on fiddle here: http://jsfiddle.net/PLb5K/
To conduct a basic test, I implemented the following:
#nav ul li ul {
display: none; }
#nav ul li:hover ul {
display: block;
position: absolute; }
UPDATE
#nav ul:hover .sub {
display: block;
position:absolute;
}
While this corrected the "not working on hover" issue, it causes every list item to display the submenu. I am seeking assistance in ensuring only the single parent will reveal the submenu.