Problema con allineamento lista (vertical-align=bottom???)

[goat]

Ciao cari,
prima di tutto l'ausilio visivo:



Il div blu contiene la lista marrone. Io vorrei posizionare la lista marrone in basso rispetto al div blu, e non come ora che è posizionata in alto.
Il problema è che i[*] di quella lista sono generati in PHP, quindi, a seconda dei casi, può essere di una, due o tre voci.
Ho fatto un po' di prove ma non riesco mica ad ottenere un effetto soddisfacente.

Ed ecco il codice HTML che ho utilizzato:

            <div class="content-mansione-socio">
                <div class="lista-mansioni">
                    <ul>
                        <?php foreach($socioselezionato->getSociQualifiches() as $qualifiche): ?>
                        [*]<?php echo $qualifiche->getQualifiche()?>
                        <?php endforeach; ?>
                    [/list]
                </div>
            </div>

E quello CSS:

.content-mansione-socio {
    position:relative;
    width:auto;
    height:104px;
    background-color:#0066FF;
    float:left;
    }
.lista-mansioni {
    margin-left:20px;
    }
.lista-mansioni ul {
    position:relative;
    width:150px;
    margin:0;
    padding:0;
    list-style-type:none;
    background-color:#996600;
    float:left;
    }
.lista-mansioni li {
    position:relative;
    font-family:Arial, Helvetica, sans-serif;
    font-size:14px;
    color:#FFF;
    line-height:20px;
    float:left;
    } 

C'è speranza?
Grazie,
goat