Как разместить изображение в нижней части div?

Я хочу, чтобы html-образ был заподлицо с нижней частью тега div. Кажется, я не могу найти способ сделать это.

Вот мой HTML:

<div class="span8">
  <img src="/img/play-shot1.jpg" class="text-center shadow">
</div>

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

Ответы

Ответ 1

Добавьте относительное позиционирование к тегу div обертки, затем полностью поместите изображение внутри него следующим образом:

CSS

.div-wrapper {
    position: relative;
    height: 300px;
    width: 300px;
}

.div-wrapper img {
    position: absolute;
    left: 0;
    bottom: 0;
}

HTML:

<div class="div-wrapper">
    <img src="blah.png"/>
</div>

Теперь изображение находится в нижней части div.