How to collapse a div around an image with using float

can this be done?

[benlieb]

I want to collapse a div around an image. Unfortunately the only way I know for a div not to take up 100% width is to give it a specific width or float it (which essentially collapses it around whatever is in it).

I don't want either of these things.

How can I acheive this? Does anyone know?

[Gorilla]

If you tell us why you want to do this, you might get suggestions on how to achieve the effect you are looking for. You are asking in the CSS forum, so I guess you are trying to achieve a visual effect of some sort?

[createErrorMsg]

I don't want either of these things.

Knowing why you don't want to assign a specific width or float the div would help.

A third option would be to give the div a display: inline, the drawback being that it is then treated as an inline element in every way.

Are you sure you even needthe div 'collapsed' (I believe the usual term is 'shrinkwrapped') around the image? Is the div necessary? If it's right against the image, you may be able to apply your styles directly to the image itself.

[benlieb]

What I want to do is add a shadow effect of varying depth to the image or any other box (table, div, ul) of varying widths and heights at will. I've looked at many aproaches to this, most of which would be simplified by a "shrinkwrap" css property.

This (the shrinkwrapping) should exist now or eventually, as I see no reason why it shouldn't.

[createErrorMsg]

Float is the best shrinkwrapping available.

If you're not willing to go the float route, you may have to use some form of scripting to detect the image width and apply this dynamically to the wrapper div.

If floating the div itself is unacceptable, you can add an extra <span> around the image/content and apply the float to that...

<div><span class="float_me"><img src="image.gif /></span></div>

[note]My suggestion above of using display:inline will work, but it only gives the "illusion" of shrinkwrapping; background colors will bleed right out of it.[/note]