sub- och childmenues i rad

Hej hej, jag skulle behöva lite hjälp. Efter en dags googlandet har jag fortf inte hittat vad jag letar efter.
Jag skulle vilja veta hur man får en drop down menu, t ex http://www.alistapart.com/d/horizdropdowns/horizontal.htm att bete sig såhär:
När man för muspekaren över "menu_1" visas submenyerna i bredd, under "menu_1". När man sedan för muspekaren över "submenu_1.1" visas childmenyerna under "submenu_1.1" osv.

steg ett:
menu_1 menu_2

steg två:
menu_1 menu_2
submenu_1.1 submenu_1.2

steg tre:

menu_1 menu_2
submenu_1.1 submenu_1.2
childmenu_1.1.1 childmenu_1.1.2

Har försökt testa med display: inline; men det verkar inte fungera.

Tacksam för hjälp.

//nidron

body {
	font: normal 11px verdana;
	}

ul {
	margin: 0;
	padding: 0;
	list-style: none;
	width: 150px; /* Width of Menu Items */
	border-bottom: 1px solid #ccc;
	}
	
li ul {
	display: none;
	}

/* Styles for Menu Items */
ul li a {
	display: block;
	text-decoration: none;
	color: #777;
	background: #fff; /* IE6 Bug */
	padding: 5px;
	border: 1px solid #ccc; /* IE6 Bug */
	border-bottom: 0;
	}
	
/* Holly Hack. IE Requirement \*/
* html ul li { float: left; height: 1%; }
* html ul li a { height: 1%; }
/* End */

li:hover ul, li.over ul { display: block; } /* The magic */

Tack för svaret, men får det inte att fungera. Sitter iofs inte vid min egen dator så jag kan inte experimentera ordentligt, men.. Submenyerna hamnar under varandra, inte bredvid, och chilcmenyerna blir synliga utan att man fört muspekaren över någon submenu.
Vad är det som ska göra skillnaden, float: left;?