css - Floating image after last word -

i want image (rating stars) float , of title. when title big (two rows), image on next row, not on last word.

is there way float image after dot of last word?

http://jsfiddle.net/mjgu4/1/

<h1>this short text</h1><span>float image</span> <br /><br /> <h1>this long text. long text. long text. long text. long text. long text. long text.this long text.</h1><span>float image</span> 

the key set h1 tags displayed inline elements. confuse how browser flows diferents elements. browser introduce linebreak when renders block elements (like h1) need display headers inline elements.

fiddle example

code fiddle