WordPress menu issue - auto expanding.

[definitive]

I'm writing a simple template from scratch, and having an issue with the WP3 menu.

On the left is what I'd like the menu to look like - When you mouse over Page Title 1, a drop down menu appears showing a link to Sub Page 1, but for some reason the Sub Page 1 automatically expands and warps the page whenever I add pages through the Menus in Appearance section.

(Would like outcome on left, but keep getting right where Sub Menu stays open at all times).

Here's the code I tried:

functions.php

	add_action('init', 'register_custom_menu');

	function register_custom_menu() {
	register_nav_menu('custom_menu', __('Custom Menu'));
	}

header.php

	<div id="menu">
		<?php wp_nav_menu( array( 'theme_location' => 'custom_menu' ) ); ?>
	</div>

style.css

#menu {
padding: 0px;
}

#menu ul {
	padding: 0px;
	list-style: none;
}

#menu li {
	float: left;
}

#menu a {
	padding: 0px 10px 0px 0px;
	text-decoration: none;
	font-family: helvetica, arial, sans-serif;
	font-size: 15px;
	font-weight: bold;
	color: #000;
}

#menu a:hover {
	text-decoration: none;
	color: #333;
}

When I try the TwentyEleven theme, the drop down menus work properly, and the code there doesn't seem to be much different than what I use, but for some reason, my theme is having issues. I originally started out with a child theme for TE, but there was so much bloat in there which I have no use for, that I started making too many mistakes trying to sort through all of it.