html - 在页面中间左对齐文本

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