Centrage horizontal et vertical — universel

dabblet.css

/**
 * Centrage horizontal et vertical — universel
 */

html, body {
    height: 100%;
    margin: 0;
    width: 100%;
}
.layout {
    display: table;
    height: 100%;
    overflow: hidden;
    text-align: center;
    width: 100%;
    *position: relative;
}
.layout-wrapper {
    display: table-cell;
    vertical-align: middle;
    width: 100%;
    *left: 0;
    *position: absolute;
    *top: 50%;
}
.layout-content {
    display: -moz-inline-stack;
    display: inline-block;
    text-align: left; /* Retour à l'alignement classique, non nécessaire */
    *display: inline;
    *left: 0;
    *position: relative;
    *zoom: 1;
    *top: -50%;
}

dabblet.html

<div class="layout">
    <div class="layout-wrapper">
        <div class="layout-content">
            <div contenteditable="true">
                Vous êtes<br />
                centré !
            </div>
        </div>
    </div>
</div>

settings.json

{"view":"split","prefixfree":"1","page":"html"}