Ich muss eine ungeordnete Liste mit unbekannter Breite zentrieren, während die Listenelemente weiterhin linksbündig bleiben.

Erzielen Sie das gleiche Ergebnis wie folgt:

HTML

<div>
    <ul>
        <li></li>
        <li></li>
        <li></li>
    </ul>
</div>

CSS

div { text-align: center; }
ul { display: inline-block; text-align: left; }

Außer meiner<ul> hat keine Eltern div.ul { margin: 0 auto; } funktioniert nicht, weil ich keine feste Breite habe.ul { text-align: center; } funktioniert nicht, weil die Listenpunkte nicht mehr ausgerichtet bleiben. Wie kann ich das zentrieren?<ul> während die<li>Ist er linksbündig ausgerichtet (ohne einen übergeordneten Div-Wrapper)?

<ul>
    <li></li>
    <li></li>
    <li></li>
</ul>

BEARBEITEN: Vielleicht war meine Formulierung nicht die beste ... Der erste Codeblock funktioniert bereits ... Ich muss es tunohne das<div> wrapper, wenn das natürlich möglich ist. Float-Tricks? Tricks mit Pseudoelementen? Es muss einen Weg geben.