left align text in the middle of the page

Question

.equiv {
  margin: auto;
  display: table;
}
.equiv .eso {
  display: table-cell;
}

I use those styles in order to align center the container .equiv, and keep its contents (in .eso) left aligned:

<div class="equiv">
  <div class="eso">
    <p>Consider this text<br>
      as a verse of a poem<br>
      that is left aligned<br>
      but in the middle of the page.</p>
    <p>(The middle of the page<br>
      corresponds to the middle<br>
      of the largest line of course).</p>
  </div>
</div>

well, it works in Firefox and Chrome, but not in Explorer, where the text is simply left aligned (but not in the middle).
Is there a workaround?

Answer 1

That's quite simple actually and you have all the wrappers you need.

.equiv {
  text-align: center;
}
.eso {
  display: inline-block;
  text-align: left;
}