Mac IE 5 clear/float bug

[blueark]

A web page I'm working on seems to work fine on most browsers, but not IE 5 on the Mac. It's not that important, but I'd love to know if anyone has a decent workaround that won't upset every other browser!

Here's a simple example of the problem:

<div style="clear: both;">
	<h2>Test</h2>
	<img src="testimg.gif" width="320" height="250" style="float: left;" />
	<p style="clear: none;">Some text</p>
</div>
[code]

In most browsers, the text will display to the right of the image. In IE5 on the Mac, it displays underneath. From what I understand, there's a bug that inherits the "clear" value from the parent, regardless of whether or not you redefine it on another element. I found a few articles that acknowledge this bug, but no workarounds as yet.

Has anyone had any luck getting around this? Like I say, it's no big deal really -- Microsoft have stopped developing IE on the Mac anyway -- but it's the only thing I haven't been able to fix on that platform.

 

[manarth]

Here's a hack that will hide stuff from Mac IE:

/* css comment [COLOR=red]\[/color]*/
div.someclassname {clear: none;}
/* */

When Mac IE encounters a comment with a \ just before the end of the comment, it starts ignoring the following css, until it reaches another comment (without the \).

<marc> i wonder what will happen if i press this...[ul][li]please tell us if our suggestion has helped[/li][li]need some help? faq581-3339[/li][/ul]

 

[blueark]

Thanks for the reply.

I've been using the backslash hack already, but it doesn't really solve this problem. The issue here is that the clear:none is ignored whether it's hidden or not.

It turns out that, luckily, the places where this problem occurs is at the top of my page, so I've been able to work around it by adding an inline style to the first block...

<div class="some_class_with_clear_both" style="clear: none;">
 1st block
</div>
<div class="some_class_with_clear_both">
 2nd block
</div>

It's not ideal, but it gets me out of a hole for now.