IE5 Вертикальное выравнивание

Question

Я работаю над проектом для сканера, который запускает IE5 (да, я знаю!), И они попросили, чтобы ссылка была элементом блока с высотой. Внутри этого блока они хотят, чтобы его содержимое было выровнено по центру как по вертикали, так и по горизонтали.

У меня есть этот HTML (для одного):

<a class="block cancel vertical-align text-center" href="#" id="btn-cancel">
    <h4>Cancel</h4>
</a>

и SCSS для этого:

.block {
    display: inline-block;
    *zoom: 1;
    *display: inline;

    height: 100%;
    width: 100%;
    background-color: #3C60EF;

    .block-content {
        padding: 4px;

        > h1, > h2, > h3, > h4, > h5 {
            margin-top: 0;
        }

        @media screen and (min-width: 992px) {
            padding: 10px;
        }
    }
}

.block.vertical-align {    
    display: table-cell;
    vertical-align: middle;

    h3, h4, h5, h6, p, .block-content {
        padding: 0 10px !important;
    }

    form {
        .form-group {
            margin: 0;
        }
    }
}

a.block {    
    background-position: center center;
    background-repeat: no-repeat;
}

.text-center {
    text-align: center;
}

это прекрасно работает на моей машине (с использованием последних браузеров), но на сканере все выровнено по верху.

Кто-нибудь может предложить что-нибудь, что может мне помочь?

Answer 1

<style>
.text-center {
    text-align: center;
}

.fullFrame{
    width: 100%;
    height: 100%;
}
</style>

<table class="fullFrame">
    <tr>
        <td class="text-center">

<a class="block cancel vertical-align text-center" href="#" id="btn-cancel">
<h4>Cancel</h4>
</a>

        </td>
    </tr>
</table>

Это сделает ссылку отмены в вертикальном и горизонтальном центре страницы. Я мог только проверить, как низко, как IE6, и это, казалось, работало. Не уверен насчет IE5, но я не знаю, почему вы хотели бы попробовать это поддержать, так как он очень устарел.