Horizontales Verschachteltes Menue

[counter18]

Hi,

hab angefangen mir ein ul li Menue zu basteln, doch es wird nicht so angezeigt wie ich es erwarte. Es werden alle Links angezeigt. Das sollte nicht der Fall sein. Wo habe ich da meinen Fehler, jemand ne Idee?
css

	#navigation {
	width:100%;
	height:30px;
	}
		#nav {
		margin: 0;
		padding: 0;
		}
		#nav, #nav li {
		float: left;
		list-style: none;
		}
		#nav li {
		padding: 2px 0;
		width: 111px;
		text-align:center;
		}
			#nav li ul {
			display:none;
			}
			#nav li:hover ul {
			display:block;
			}
			#nav li ul li {
			list-style:none;
			display:block;
			}
	#submenue {
	width:100%;
	height:25px;
	}

html

		<div id="navigation">
			<ul id="nav">
				<li>Link 1</li>
				<li>Link 2</li>
					<ul>
						<li>Link 2.1</li>
						<li>Link 2.2</li>
					</ul>
				<li>Link 3</li>
					<ul>
						<li>Link 3.1</li>
						<li>Link 3.2</li>
						<li>Link 3.3</li>
					</ul>
				<li>Link 4</li>
					<ul>
						<li>Link 4.1</li>
						<li>Link 4.2</li>
						<li>Link 4.3</li>
					</ul>
				<li>Link 5</li>
				<li>Link 6</li>
				<li>Link 7</li>
				<li>Link 8</li>
			</ul>
		</div>

[hero-master]

Hi
du musst die Untermneus in einen Listenpunkt (li) packen, damit das klappt

		<div id="navigation">
			<ul id="nav">
				<li>Link 1</li>
				<li>Link 2</li>
<li>
					<ul>
						<li>Link 2.1</li>
						<li>Link 2.2</li>
					</ul>
</li>

[counter18]

Danke, funkt!