When an image is placed 
inline with text, you can use CSS to adjust the vertical alignment. By default it will align with the bottom (baseline) of the text.
Set the vertical alignment of an element/image or Table Cell.
Syntax
vertical-align: length | percentage | baseline | bottom | middle | sub | super | text-bottom | text-top | top | inherit ;
length - A value in px, pt, em or % that will raise or lower the box position (negative values move down)
baseline - Align the baseline of the element with the baseline of the parent element. (default)
top - Align the top of the element with the top of the tallest element on the line.
bottom - Align the bottom of the element with the lowest element on the line.
middle - Place the element in the middle of the parent element.
super - Align the element as if it were a superscript.
sub - Align the element as if it were a subscript.
text-bottom - Align the bottom of the element with the bottom of the parent element's font.
text-top - Align the top of the element with the top of the parent element's font
inherit - inherit from the parent element.
vertical-align can be used to position images within a block of text, or to position text vertically within a table cell.
For table cells only the options (top, bottom, middle, baseline) are valid. This is equivalent to the old valign property.
Examples:
h1 { vertical-align: 100px; }
.emw3class { vertical-align: middle; }
#emw3id { vertical-align: text-bottom; }
td {vertical-align: top;}
Try it:
When an image is placed |
(CSS 1) Browser Support: All major browsers, IE 8+
“I'm a tidy sort of bloke. I don't like chaos. I kept records in the record rack, tea in the tea caddy, and pot in the pot box” ~ George Harrison
Related:
clip - Clip an absolutely positioned image/element.
text-align - Horizontal alignment of text.
box-align - Align the child elements of a box.
Background-Position - Starting position of a background image.
Centering in the Unknown - CSS Tricks.