оставил текст Выровнять в середине страницы

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

Answer 2

Если вам нужно, чтобы он был центрирован как по вертикали, так и по горизонтали, вы можете сделать это следующим образом.

html, body { 
 
    height: 100%; 
 
    margin: 0; 
 
} 
 
.equiv { 
 
    height: 100%; 
 
    margin: auto; 
 
    display: table; 
 
} 
 
.equiv .eso { 
 
    display: table-cell; 
 
    vertical-align: middle; 
 
}

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