Liste an Textarea ausrichten

[Matze]

Hallo,

ich habe eine horizontale Liste mit Menüpunkten.
Die Liste hat margin und padding auf 0 und die Listenelemente haben float:left.
Jetzt soll eigentlich unter die Liste eine textarea.
Durch die gefloateten <li>-Elemente befindet sie ich allerdings rechts daneben.

Ich hab jetzt versucht mit einem Element dazwischen und clear etwas zu erreichen aber dadurch verschiebt sich zwar der Abstand nach unten aber die Box bleibt trotzdem rechts.

Kann mir bitte jemand einen Tipp geben?
Irgendwie steh ich auf dem Schlauch :(

Hier der HTML-Code:

<ul id="siteInputFormats">  
  <li>Überschrift</li>  
  <li>Link</li>  
  <li>Fett</li>  
  <li>Kursiv</li>  
  <li>Unterstrichen</li>  
</ul>  
<textarea name="siteInput" cols="60" rows="10" id="homeSiteInput"></textarea>

hier der CSS-Code:

#siteInputFormats {  
    list-style-type:none;  
    margin:0;  
    padding:0;  
}  
#siteInputFormats li {  
    float:left;  
    padding:0 5px 0 5px;  
    margin-right:1px;  
    border:1px solid #999;  
}

Danke und Grüße,

Matze