CSS Вертикальное выравнивание элементов

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

На практике все намного хуже. Не буду долго рассусоливать проблему и покажу один из вариантов.

Вариантов много, но я выбрал с использованием Flexbox css.

У этого варианта есть минус - не работает в старых ИЕ.

Код:

 
.outer {
    display: flex;
    width: 200px;
    height: 200px;
}

.inner {
    width: 100px;
    margin: auto;
}

Важны 2 момента:

 
display: flex; // Для внешнего блока

margin: auto; // Для внутреннего