Заблокировать элемент в нижней части содержимого div

#Container {
    width: 500px;
    height: 600px;
}

#TheElement {
    width: 500px;
    height: 100px;
    background-color: #000000;
}

Как я могу заставить #TheElement быть заблокированным в самом низу #Container, независимо от другого содержимого внутри контейнера, без кучи промаха маржи?

Ответы

Ответ 1

Вы можете использовать относительное абсолютное позиционирование:

http://jsfiddle.net/gzJM6/

#Container {
    width: 500px;
    height: 600px;
    position: relative
}

#TheElement {
    width: 500px;
    height: 100px;
    background-color: #000000;
    position: absolute;
    bottom: 0;
    left: 0;
}