An IE/Float problem

Another amateur's problem I'm afraid. Don't know whether anyone might
be kind enough to look at this and spot what the problem might be - I
suspect that it's something fairly simple but can't see exactly what.

There's a draft page of a technical site viewable at:

www.weatherstations.co.uk/nd2/vp_main.htm

This page is unfinished as yet - there's one specific problem in its
current incomplete form that I'm asking about:

There's a clouds banner image below which there should be a header
'Vantage Pro 2' and some body text following with an image of some
technical parts floated to the right. This looks fine in FF2 but in
IE7 the header doesn't start until below the floated image rather than
the header and text flowing around the image. So what's causing this
behaviour in IE7?

I guess there's something important that I don't understand about how
the float style should be defined or exactly where the img tag should
be positioned in the HTML flow relative to its neighbouring tags? Any
pointers to an explanation of how to do this correctly would be much
appreciated.

JGD

John Dann wrote:

There's a draft page of a technical site viewable at:

www.weatherstations.co.uk/nd2/vp_main.htm

There's a clouds banner image below which there should be a header
'Vantage Pro 2' and some body text following with an image of some
technical parts floated to the right. This looks fine in FF2 but in
IE7 the header doesn't start until below the floated image rather than
the header and text flowing around the image. So what's causing this
behaviour in IE7?

I'm not in a position to be definitive, but I rather suspect problems
may be caused because <img> can appear in in-line context, and IE7 is
getting it wrong.

Try wrapping the <img> tag in a div, and floating the div.

Ian