Вертикальное выравнивание элементов A внутри LI

Question

У меня проблема с реализацией нового дизайна.В то время как элементы привязки выровнены правильно в старом дизайне, по какой-то причине элементы привязки выровнены по низу в новом дизайне, при этом html / css показывает, что части UL, LI и A абсолютно одинаковы.

#treeview ul {
    padding-top: 3px;
}
#treeview ul li {
    background: none repeat scroll 0 0 transparent;
    line-height: 24px;
    padding-bottom: 3px;
    padding-left: 0;
}
#treeview ul li.active {
    background: none repeat scroll 0 0 #DDDDDD;
}
#treeview ul li ul li {
    padding-left: 30px;
}
#treeview ul li a {
    color: #444444;
    padding-left: 5px;
    text-decoration: none;
}


<div id="treeview">
    <ul>
        <li>
            <img src="assets/js/no-expand.png">
            <img class="icon" width="24" height="" src="assets/images/icons/icon_dance24x24.png">
            <a title="Essential" href="/index/night-clubs/essential/">Essential</a>
        </li>
    </ul>
</div>

Answer 1

Попробуйте это ...

#treeview ul li * {
    vertical-align: middle;
}

Answer 2

Попробуйте:

ul li {
    display: table-cell;
    vertical-align: top;
}