Какой лучший способ центрировать значки на линии, когда изображения меньше высоты строки?
Например (стили для упрощенного чтения):
<div style="line-height: 20px">
<img style="width: 12px; height: 12px;"/>
Blah blah blah
</div>
Вот пример jsFiddle. В этом примере также показано, почему vertical-align: middle
не работает.
Я хочу, чтобы img был центрирован против текста div. То есть, даже если текст, заключенный в несколько строк, будет центрироваться по одной строке. В идеале, решение не будет включать установку маржи/прокрутки на изображении и будет работать, даже если я не знаю высоту строки.
Что я читал:
Как вертикально выровнять текст рядом с изображением с помощью CSS? (имеет дело с где изображение больше, похоже, здесь не применяется)