nel div dove è contenuto il mio footer della pagina vorrei allineare a destra una parte di testo e a sinistra un'altra parte di testo.. però non ci riesco

codice:
div#footer {
background: #eaeaea;
color: #333333;
clear:both;
width:100%;
margin: 0;
}
.left {
text-align:left;
}
.right {
text-align:right;
}

<div id="footer"><span class="left">Testo 1</span><span class="right">Testo 2</span></div>
l'effetto è che il testo è tutto allineato a sinistra...

chi mi può aiutare...


thanks