Согласовать значок вертикально в центр первой строки текста ⇐ CSS

[Anonymous]

Вот глаза со свойством align-items: center. Они подходят для однострочного текста и НЕ подходят для многострочного текста:

[img]https://i.sstatic.net /FeuRN.png[/img]


Вот глаза с элементами align-items: baseline (или flex-start). Они лучше подходят для многострочного текста, но не идеальны для всех, поскольку я хочу выровнять взгляд по центру первой строки текста:




Я пытаюсь добиться следующего: < /p>




Посмотрите, как изображение глаза центрировано первую строку текста?

Можно ли сделать это элегантно с помощью свойств flexbox, не используя отступы или поля?

(Это упрощенный пример. В реальной задаче я не хочу вводить отступы, поскольку это повлияет на другие элементы.)

Вот jsfiddle, с которым можно поиграть: http://jsfiddle.net/sqp1wdap/

Подробнее здесь: https://stackoverflow.com/questions/321 ... ne-of-text