which IE6 bug?

**ieee488** · Mar 17, 2010 15:16

I am trying to float some text around a photo image using

Code:

<div>
<p>
<img class="floatleft" src="image.gif" alt="" width="100" height="100">Lorem ipsum dolor sit amet, consectetuer...
</p>
</div>

I have set <div> to clear:both so that if there isn't enough text, it doesn't matter and the <div> stack on top of each other.

In Firefox3 and Opera, there is not gap between the <div>, but in IE6 there is.

Can someone point me to the IE6 bug that is the culprit?

**Rayzur** · Mar 17, 2010 15:58

Hi,
It sounds like you just need to trip haslayout for IE6.

Working from the code you posted this was the best I could make of what you are trying to do.

Code HTML4Strict:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Test</title>
 
<style type="text/css">
div {
    clear:both;
    overflow:hidden;/*contain inner floats and IE7 haslayout*/
    background:#EEF;
}
.two {background:#CDF;}
 
* html div {zoom:1;}/*IE6 haslayout*/
 
img.floatleft {
    float:left;
    background:red;
}
.two img {background:lime;}
p {margin:0;}
</style>
 
</head>
<body>
 
<div>
    <p><img class="floatleft" src="image.gif" alt="" width="100" height="100">Lorem ipsum dolor sit amet, consectetuer...</p>
</div>
<div class="two">
    <p><img class="floatleft" src="image.gif" alt="" width="100" height="100">Lorem ipsum dolor sit amet, consectetuer...</p>
</div>
 
</body>
</html>

**ieee488** · Mar 17, 2010 20:40

That was it!
Thank you.

Boy, do I hate IE.

User Tag List

Thread: which IE6 bug?

Thread Tools

Display

which IE6 bug?

Bookmarks

Bookmarks

Posting Permissions