Выровненный по вертикали текст и изображение в списке

Question

Есть ли способ вертикального выравнивания текста и изображения в списке?

например,

<li>Some text here <img src="image.jpg" alt="" /></li>

Текст не выравнивается по середине стороны изображения,он появляется внизу, затем изображение рядом с ним.Мне нужно, чтобы текст находился в центре между изображениями сбоку.

Как лучше всего это сделать?Я знаю, что изображение в списке не является допустимым HTML (AFAIK).

Спасибо:)

Answer 1

Вы можете использовать

li img {vertical-align: middle;}

если текст занимает одну строку

Answer 2

Если текст не переносится, вы можете установить высоту строки, равную высоте изображения:

li { line-height: 42px }

И да, наличие img внутри li вполне допустимо, поскольку img является (по умолчанию) встроенным элементом, а li является элементом уровня блока.