Выровнять содержимое div по нижнему краю

У меня есть div, содержащий 2 абзаца. Я хочу, чтобы абзацы были выровнены по правому нижнему углу div. Мне удалось выровнять параграммы с помощью text-align: right, но я борюсь с попыткой выровнять параграммы по нижней части div.

Разметка довольно проста.:

   
content 1
   
content 2

CSS:

div{
    border: 1px red solid;
    height: 100px;
}

p{
    text-align: right;
}

Я пробовал использовать position:absoluteдля параграмм и настройку bottom: 0, но из-за абсолютного позиционирования абзацы перекрывают друг друга.

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

Есть ли способ добиться такого эффекта, что контент «растет снизу»?

Эффект, который я хочу, такой (отфотошоплен):

И скрипка выше:http://jsfiddle.net/cbY6h/