Columnas mal alineadas UL LI

[roylugones]

Quiero hacer con UL - LI, dos columnas con contenido en mi web. El problema que tengo es que la columna donde haya más contenido, está bien alineada en la parte de arriba del todo. Pero la otra columna, la mas reducida de contenido, pues la alinea abajo del todo. Y realmente me interesa todo lo contrario, como es lógico. Que todo esté alineado arriba.

Lo puedo solucionar poniendo FLOAT:LEFT pero si lo hago, tengo otro problema aparte. Tengo un fondo general de la web, que según voy "construyendo" la página, va formándose ese fondo hacia abajo. Pero si pongo el float:left, ya no me sirve.

El CSS

Código:

ul#contenido-principal{
  position:relative;
  margin:20px 0px 0px 20px;
  padding:0px;
  list-style-type:none;
  display:inline;
}

ul#contenido-principal li{
  position:relative;
  display:inline;
  margin-right:20px;
  padding:0px;
}

----

HTML

Código:

<ul id="contenido-principal">
  <li>
     <div id="noticia-principal">         
        Esto es un ejemplo, esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo.   
     </div>
   </li>
   <li>
     <div id="predicciones-portada">
        Esto es un ejemplo, esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo. Esto es un ejemplo, esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo,  esto es un ejemplo.      
     </div>	  
   </li>
</ul>

Muchas gracias de antemano.

[alexk]

no entiendo que quieres hacer, ni que hace una lista desordenada alli :S... un ejemplo mas grafico de lo que necesitas seria muy util para ayudarte mejor...

[roylugones]

Un ejemplo rápido en esta imagen. En ese sitio imaginario para dos columnas, me queda mas o menos de esa forma. La columna donde haya menos contenido empieza desde abajo, en vez de desde arriba.