floating an image in dynamic content

June 28, 2005 11:28 AM

CSS with dynamic content. I'm trying to create a web page using CSS and text pulled from a database, so that it looks like this: http://www.blogfucker.com/junk/css_help.gif. "Image 2" is simply floated left. Very simple to do with static content. But this is for a client who will only be able to edit the text, which will be entered as a single block of text. How do I throw a floated image in there so it shows up roughly in the middle of the page? I've considered writing a script to count the number of paragraphs (or even characters) and dividing by two, and throwing it in that way. But I feel there must be a simpler way.
posted by jpoulos to Technology (2 answers total)

Best answer: I don't know if it helps, but I just wrote this example. It works by having a tall but invisible float that forces the real float further down. The problem is that you have to guess how far down to force it by giving a particular height to the invisible float. The presence of that box may push the text a little bit to the right, despite how I tried to set the width and margin.

Look at the CSS for how it works. I didn't have a lot of time, so I only tested it in FF1.0.4 and IE5.5, but they both look OK.
posted by jepler at 12:16 PM on June 28, 2005

Response by poster: Fantastic. That's exactly what I was looking for. Thank you, jepler.
posted by jpoulos at 12:40 PM on June 28, 2005