在页面中间左对齐文本

Question

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

我使用这些样式来使容器 .equiv 居中对齐，并保持其内容（在 .eso 中）左对齐：

<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>

嗯，它适用于 Firefox 和 Chrome，但不适用于 Explorer，其中文本只是左对齐（但不在中间）。
有解决办法吗？

Answer 1

实际上这很简单，您拥有所需的所有包装器。

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