Изображение в элементе списка влияет на положение другого текста в других элементах списка

Question

У меня есть ненумерованный список, который я пытаюсь отформатировать для меню.

<ul>
    <li><img src="greatImage.png"></li>
    <li>item 2</li>
    <li>item 3</li>
</ul>

Я пытаюсь расположить все элементы списка вертикально по центру. Когда я добавляю изображение к первому элементу списка, это выглядит так, как будто все остальные элементы списка перемещаются к нижней границе блока UL? В основном изображение влияет на остальную часть позиции списка.

Answer 1

Одна вещь, которую вы могли бы сделать, это установить высоту строки li равной высоте изображения

пример: http://jsfiddle.net/felcom/vdPtj/