Well, it worked, and it's really basic. Ridiculously basic enough that I'm sure many of you would've done the same thing but there are still folks out there who are continuing to learn. The advantage of it being so basic is that it's infinitely dynamic. There's no need to make sure you have set any id's properly or anything else of the sort. Code to follow.

<div id="nav_container">
<ul>
    <li><a href="#">random stuff</a></li>
    <li><a href="#">more random stuff</a></li>
    <li><a href="#">other random stuff</a>
    <ul>
        <li><a href="#">random stuff</a></li>
        <li><a href="#">more random stuff</a>
        <ul>
            <li><a href="#">more random stuff</a></li>
            <li><a href="#">other random stuff</a></li>
            <li><a href="#">things and things</a></li>
        </ul></li>
        <li><a href="#">other random stuff</a></li>
        <li><a href="#">some other things</a></li>
    </ul></li>
    <li><a href="#">some thing</a></li>
</ul>
</div>

And now the styles

#nav_container {
margin: 0;
padding: 0;
position: relative;
}

#nav_container ul li {
display: inline;
height: 100%; /* fixes height bug in IE */
}

#nav_container ul {
list-style: none;
margin: 0;
padding: 0;
position: relative;
width: 200px;
border: 1px solid #999;
}

#nav_container ul ul {
display: none;
list-style: none;
margin: 0;
padding: 0;
position: relative;
width: 200px;
}

/* must use direct child to prevent all menus from opening at once */
#nav_container ul li:hover > ul { 
display: block;
position: absolute;
margin: -20px 0 0 190px;
}

#nav_container ul li a {
padding: 5px 20px;
color: #fff;
background: #666;
display: block;
width: 160px;
color: #333;
}

#nav_container ul li a:hover {
background: #ffee00;
}

And now the final product

Widths, colors, etc, can be modified to whatever end of course. This includes floating the top level anchors for a horizontal menu