Welcome to WebmasterWorld Guest from 22.214.171.124 , register , free tools , login , search , pro membership , help , library , announcements , recent posts , open posts Become a Pro Member
Wrapping text around images within div Ensuring the height of the div is large enough to contain the image davem msg:1204350 11:07 am on Apr 19, 2003 (gmt 0) Hi,
I'm using float to allow text to wrap around an image within a DIV.
The problem I have is when the height of the text is less that the height of the image. In this instance, the image overlaps the bottom of the div.
The behaviour I'd like is for the DIV's height to the the maximum of it's content or the floated image.
In IE, setting the DIV's height to anything does the trick, though from what I read in the spec, I suspect this is a bug. This doesn't work in other browsers...
Birdman msg:1204351 11:22 am on Apr 19, 2003 (gmt 0)
Put an empty div after the img and the text. What happens is that floated elements are taken out of the flow and not calculated in the div's height. The empty div should have the style clear: both. <div> <img src="" style="float: left" />Text text text text text text text text text text text text text text text text text text text <div style="clear: both;"></div> </div>
Welcome to Webmaster World!
Longhaired Genius msg:1204352 11:26 am on Apr 19, 2003 (gmt 0)
You can work around this problem whilst sticking to the specs by putting an empty div at the bottom of the box and giving it the declaration "clear: both". davem msg:1204353 11:58 am on Apr 19, 2003 (gmt 0)
Just what I needed.
Thanks very much,