Every time I try to do something seemingly-simple in CSS, it doesn\'t work.
I have a content div that contains a 460x160 image. All I want to do is position the imag
Ok. So I've actually had this same problem and at some point the answer hit me like Saturday night cheese cake. It's almost the same hit and miss effect that you have when you try to set text wrapping in Word.
img.right {
float: right;
}
Now all you have to do is just set it INSIDE the text where you want the lines to break. The text will float to the end of the text so it will always push the text to the left but if you put the image in the middle of the text like...
<p>This is some text <img src="example.jpg" class="right" /> and then add
some more text.</p>
the top part stays where it is and text is free to float above the image and the rest is pushed to the left of the image. It's a workaround but not nearly as tedious as using JS and if you use a WYSIWYG editor it's even easier. Come to think of it if you use a WYSIWYG editor it has that feature automatically. :P Problem solved.
Cheers.