Eu tenho uma linha de DIVs para minha navegação e estou tentando centralizar verticalmente uma imagem com uma âncora dentro deles usando apenas CSS. Eu tentei vertical-align: middle; mas isso não está funcionando. Tenho certeza que tem a ver com o float: esquerda, já que todas as imagens são empurradas para o lado esquerdo, mas quando eu tiro as divs enlouquecem.

HTML

<div class="linkgroup">
        <img src="images/homeIcon.png">
        <li class="navItem"><a href="somelink.com" class="navLink">HOME</a></li>
    </div>
</ul>

CSS

.linkgroup{
    float: left;
    height:5px;
    }