Question

Anchor tag doesnt resize automatically depending on the content, see the following example:

http://jsfiddle.net/XmnnY/

I know I can use display inline or display inline-block, but I need that the anchor tag automatically sets its width depending of the inner html size (which is text in this case).

Thanks for help!

Answer 1

Use float:left/right (if you can) and clear:both on following item, or

use inline-block but remove all whitespaces and returns, because inline-block displays all the spaces in the inner HTML

<a href="#" style="display:block;float:left;">
    <img src="button.gif" />
</a>
<div style="clear:both">next element</div>

is ok, but also

<a href="#" style="display:inline-block;"><img src="button.gif" /></a>

Note I have removed all returns and spaces inside the a tag

Float:
http://jsfiddle.net/XmnnY/18/
InlineBlock:
http://jsfiddle.net/XmnnY/16/