Listas desordenadas anidadas y Display

[thunder.scripts]

¿No querés usar float por algún motivo en particular?
Porque con un mínimo cambio a tu hoja de estilos podrías lograr el efecto que buscás:

Código:

#listas p
{
	margin: 0px;
	border: 0px;
	padding: 15px;
	text-indent: 25px;
	background: #CCCCCC;
}

#listas ul li h1
{
	padding: 8px 8px 8px 10px;
	margin: 0px;
	border: 0px;
	font: 18px Verdana, "Trebuchet MS", Arial, sans-serif;
	background: #999999;
}

#listas ul
{
	margin: 0px;
	border: 0px;
	padding: 15px 0;
}

#listas ul li /*Esto se supone que hace que la lista se vea en dos columnas*/
{
	list-style-type: none;
	float: left;
	margin-left: 15px;
}

#listas ul li ul li
{
	display: list-item; /*Esto se supone que hace que las dos sublistas se vean como una lista normal*/
	float: none;

}

Código:

	<div id="listas">
		<p>Bla,bla,bla,bla</p>
		<ul> <!-- Lista principal -->    
			<li>
				<h1>Lista 1:</h1>
				<ul> <!-- Lista secundaria 1 -->
					<li>Elemento 1.1</li>
					<li>Elemento 1.2</li>
				</ul>
			</li>
			<li>
				<h1>Lista 2:</h1>
				<ul> <!-- Lista secundaria 2-->
					<li>Elemento 2.1</li>
					<li>Elemento 2.2</li>
				</ul>
			</li>
		</ul>
	</div>

Suerte
Fede