CSS Div Wrapping in IE7: Your help would be appreciated.

dreadsword

Hey all - I'm having a problem with getting text to wrap around a DIV in IE7. It of course renders nicely in FF.

The page in question is http://techwatching.com.

The content on that page changes regularly, so here are two screen grabs:
FF2 behaviour, as it should be everywhere
IE7 wrapping issue

The classes are like so:

The DIV's are arranged as follows:

If you take a look at the page code, you'll see its a real dog's breakfast - I'm by no means a designer or coder by profession - strictly a weekend warrior.

That being said, I'm stymied by this one and would really appreciate any assistance you can share. I've tried reorganizing divs, different "display:" settings, "position:" settings, etc. to no avail. If tried it with and without "min-height" as well.

Any suggestions?

-Rod.

Jan 16 '08 #1

garrow

I think it might be something to do with inline-block, its not supported in firefox.

If you put a 1px border on new_story you'll see its top left corner is actually at the top left corner of the video box.
IE appears to be trying to push the content as far right as possible to fit inside this box.

You shouldnt use inline-block for floats anyway, as block and float takes it out of out of the flow of the document.

Jan 17 '08 #2

dreadsword

Garrow - thanks for the reply; I've changed out the php script that generates the output, so at least it should be easier to experiment now - first thing I'll try will be your suggestions.

Thanks and regards,
-R

I think it might be something to do with inline-block, its not supported in firefox.

If you put a 1px border on new_story you'll see its top left corner is actually at the top left corner of the video box.
IE appears to be trying to push the content as far right as possible to fit inside this box.

You shouldnt use inline-block for floats anyway, as block and float takes it out of out of the flow of the document.

Jan 18 '08 #3