Trying to create a Suckerfish dropdown menu

I am trying to create a dropdown menu where, when a user hovers over a menu item, a submenu appears. Here is my CSS:

#app_menu ul{
	margin-top: 0px;
	margin-left: -999px;
	margin-right: 0px;
	margin-bottom: 0px;
	list-style: none;
	display: block;
	padding: 0px;
	width: 90%;
}
 
#app_menu li:hover {
	margin-left: 10px;
	background-position: left top;
	display: block;
}

'#app_menu ul' is the styling for the submenu items. By default the submenus are invisible. If I set the margin-left to 0px they appear just below their respective menu items. '#app_menu li:hover' is some of the styling for the menu items. When hovering over a menu item, it shifts to the right by ten pixels, which is okay. When I'm simply trying to do is have the submenu items appear when hovering over a menu item, and disappearing when hovering away. I have tried many different combinations of ul's, li's, and hovers, but have not been able to get it to work. What am I missing here? I am trying to avoid having to use Javascript. Any suggestions would be greatly appreciated.