JSFiddle - React, Tailwind, and code Playground

by groumisg

HTML

<div class="container">
    <span class="aligner"></span>
    <h3>Text to be aligned center in the beloved ie7</h3>
</div>

CSS

div.container {
    background-color: #000;
    color: #fff;
    height: 300px;
    width: 250px;
    position:relative;
    margin:12px auto;
    text-align:center;
}
.aligner {
    display: inline-block;
    height: 100%; 
    content: ' ';
    margin-right: -0.25em; 
    vertical-align: middle;
}
h3 {
    display: inline-block; 
    vertical-align: middle;
}