Shift img несколько пикселей вверх или вниз

Question

Это кажется тривиальным, но я ничего не могу найти. У меня есть текст и небольшое изображение (значок) внутри текста, как это:

<span>ask<img src=ask.svg height=16> fav<img src=fav.svg> voted</span> 

Все, что мне нужно, это чтобы переместить изображение на несколько пикселей вверх или вниз, чтобы выглядеть лучше с текстом.

Я пробовал стили CSS, такие как margin-top:3px, padding-top:3px, display:absolute, display:relative и некоторые другие, но ничего не работает.

ОБНОВЛЕНИЕ: Не требуется вертикальное выравнивание по середине. Да, это выглядит лучше, но я все же хочу иметь возможность сдвинуть изображение на несколько пикселей вручную. Поэтому остается вопрос: как точно настроить вертикальное положение изображения в тексте на несколько пикселей в любом направлении.

Answer 1

Примечание: Верхнее поле не marginTop..same идет для заполнения и т.д. узнать больше о HTML и CSS синтаксиса.

<span>ask<img src=ask.svg height="16" style="margin-Top:-6px">fav<img src=fav.svg> voted</span> 

Это хорошая идея, чтобы взять изображение из пролетных тегов,

<span>ask</span><img src=ask.svg height="16" style="margin-Top:-6px"><span>fav</span><img src=fav.svg><span> voted</span> 

или просто использовать DIV для обертки

<div>ask<img src=ask.svg height="16" style="margin-Top:-6px">fav<img src=fav.svg> voted</div> 

Answer 2

http://jsfiddle.net/v594fvgr/

span img { 
    vertical-align:middle; 
}