Wyśrodkowanie text-align + wyrównanie wewnątrz do lewej

Dzień dobry.

Mam taki kod

<div>
  <span>tekst na sztywno</span><br>
  <span>inny tekst</span><br>
</div>

div {
  text-align: center;
}

Chcę uzyskać efekt wyśrodkowania zawartości. Ale w ten sposób, żeby 1 span był poziomo na środku (tak jak teraz), a drugi był wyrównany do lewej granicy 1 spana. Jak to uzyskać?

Dzięki
M.

Można skorzystać przykładowo z grida. Wtedy cała zawartość diva jest wyśrodkowana, a span przesunięty do lewej tak jak chcesz.

<div>
  <span>xxx xxx xxx xx xxx</span>
  <span class="left">yyy</span>
</div>

div {
   display: grid;
   justify-content: center;
}
  
 .left {
    text-align: left;
 }