Position one object next to first

Yesterday I was facing one unique problem. I was asked to set one image next to <h1> tag text. For first instance I used Float: Left but this could not resolve my problem. If the <h1> text is split into two lines the image was positioned absolute right of the full width of <h1>, but customer requirement was to set the image next to last character of the <h1>. After struggling for couple of hours I found the solution.

Solution:

<!-- Float must not be defined for h1-->

<h1 style="display: inline">Long heading text</h1>

<img src="icon.png" alt="Tooltip icon" />