Align текст в списке плавал слева уль

Question

Вот моя скрипка: http://jsfiddle.net/pUuFb/

Как выровнять третий элемент, чтобы быть на той же линии, что и первые два элемента? Я пробовал vertical-align: bottom, но он не работает. Это кажется действительно очевидной вещью, которую мне не хватает. Кто-нибудь знает, что происходит?

Answer 1

Измените CSS для элемента списка и дел до:

li { 
    margin: 0 20px 0 5px; 
    display: inline; 
} 
div { 
    display: inline; 
} 

jsFiddle example

Answer 2

Снимите класс date

<ul> 
<li>One</li> 
<li>Two</li> 
<li> 
    <div> 
     July 2nd 
    </div> 
</li>