ul affiancate

[glucaweb]

ul affiancate

Buonasera a tutti!
vorrei, attraverso il css, affiancare più liste orizzontalmente, purtroppo dopo svariati tentativi non riesco a venirne a capo.

Vorrei realizzare questo:

Lista1           Lista2
voce1.1        voce2.1
voce1.2        voce2.2
voce1.3        voce2.3

però entrambe devono essere contenute in un elemento con lo stesso sfondo.

avevo provato con questo:

<div style="background-color:red;">
<ul style="display:inline;">
<li>voce1.1</li>
<li>voce1.2</li>
<li>voce1.3</li>
</ul>
<ul style="display:inline;">
<li>voce2.1</li>
<li>voce2.2</li>
<li>voce2.3</li>
</ul>
</div>

(ho messo il css in linea per semplicità)

un'altra prova anziché il "display:inline" avevo messo "float:left" che raggiunge il mio obiettivo, però le due ul "escono" dal div.

Qualcuno ha avuto un problema simile e mi puoi aiutare?

Grazie fin da subito!

[codencode]

Il float: left assegnato all'ul va bene a patto che assegni all'ul anche una width (assoluta o relativa).

[glucaweb]

Grazie dell'aiuto