That's interesting. I've done floats and absolute positioning before, but obviously that affects the position of the element; not to mention both those techniques remove the element from the document flow. Many times that's fine, but I'd never looked at the more exotic options available for display.
I found this very interesting page @ Quirks mode discussing and demonstrating the various options for display http://www.quirksmode.org/css/display.html
Float is definitely an option for what I'm working on though. I'm trying to build a component that will fit to the size of an image, and let me caption a random amount of accompanying text as a caption, just like a newspaper. To match that look I need the text to...
- start under the image
- wrap if the text of the caption exceeds the length of the image
It's been giving me trouble, because one element, the image needs to be able to force the container element to whatever size is necessary, but the other element, the text, needs to wrap when it reaches the edge of the container. So far I'd floated the container to get it to match the image size, and my best results so far are by applying a display: block; to wrap it under the image. However, this requires you to match the text to length of the image, because the text doesn't wrap, it stays on one line and pushes the container sides out which looks pretty crappy.