对齐浮动的左ul列表中的文本

Question

这是我的小提琴：http://jsfiddle.net/pUuFb/

如何将第三个元素与前两个元素对齐在同一行？我试过了vertical-align: bottom，但它不起作用。这似乎是一件我很想念的事情。有谁知道发生了什么？

Answer 1

删除课程date

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

Answer 2

将列表项的CSS和div更改为：

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

<强> jsFiddle example