ul li 下的元素内容垂直居中

CSS:

<style>

        * { padding:; margin:; }

        li { list-style: none; }

            li span { border: 1px solid red; height: 100px; vertical-align: middle; display: table-cell; width: 100px;text-align:center; }

    </style>

HTML:

 <ul>

        <li><span>无可奈何花落去</span></li>

        <li><span>我的收藏</span></li>

    </ul>