html - Position:Relative image that doesn't push nearby text? -

simple question: need image appear in middle of paragraph of text, however, image larger height of each line of font, pushes open horizontal "gap" in text make room itself. fix this, could:

1) shrink image, not larger font. 2) use position:absolute

but don't want shrink further, small enough "technically fit" between each line of text, except need use few pixels of white area above , below line of text in.

and can't use position:absolute, because image's position in top left corner of window, instead of in paragraph want it.

i thought perhaps put dummy "placeholder" image of size 1 pixels paragraph. then, use position:absolute on real image, , continually set real image @ same location dummy image is. haven't researched see if possible, seems bit excessive such simple thing. there easier way?

edit: found adding: margin:-20px; image's style works!!!

margin:-20px; 

jsfiddle example: http://jsfiddle.net/j7tlx/3/

images block level elements if want them appear inline paragraphs. this.

img {   display: inline; }