Выравнивание изображения HTML по низу внутри контейнера DIV

У меня есть тег div с фиксированной высотой. Большинство изображений имеют одинаковую высоту и ширину.

Я хочу выровнять изображения в нижней части div, чтобы они были хорошо расположены. Вот что у меня есть на данный момент:

<div id="randomContainer">
    <div id="imageContainer">
        <img src="1.png" alt=""/>
        <img src="2.png" alt=""/>
        <img src="3.png" alt=""/>
        <img src="4.png" alt=""/>
    </div>
    <div id="navigationContainer">
        <!-- navigation stuff -->
    </div>
</div>

CSS выглядит так:

div#imageContainer {
    height: 160px;  
    vertical-align: bottom;
    display: table-cell;
}

Мне удалось выровнять изображения внизу с помощью display: table-cell и vertical-align: bottom css атрибуты.

Есть ли более чистый способ, как отобразить div как ячейку таблицы и выровнять изображения по нижней части тега DIV?