CODEWITHSUNDEEP
cssinternet-explorer-6
iceangel89
iceangel89

Reputation: 6273

IE6 - Elements pop in and out

http://img520.imageshack.us/img520/6951/723200995413pm.png

As you can see from the image above, in IE6 divs with essentially the same markup and css sometimes pop in and out of position, as I move the mouse around. I do not have any hover effect in them ...

HTML Markup

<pre>&lt;div class=&quot;block yellow shieldalert&quot;&gt;
  &lt;div class=&quot;content&quot;&gt;
    &lt;h6&gt;Shield Alert&lt;/h6&gt;
    &lt;pre class=&quot;brush:xhtml&quot;&gt;
    &lt;!-- content for syntax highlighting --&gt;
    &lt;/pre&gt;
  &lt;/div&gt;
&lt;/div&gt;</pre>

CSS (partial)

<pre>div.block {
  border: 1px solid;
  padding-left: 32px;
  margin: 5px 0;
  background-repeat: no-repeat;
  background-position: 8px 5px;
  background-color: #ebebeb;
  border-color: #d7d7d7;
}

div.content {
  background-color: white;
  padding: 2px 10px 1px 10px;
  border-left: 1px solid #d7d7d7;
}

div.yellow {
  background-color: #fff67f;
  border: 1px solid #e6e089;
}
div.yellow div.content {
  background-color: #fffde0;
  border-left: 1px solid #e6e089;
}

div.yellow h1, div.yellow h2, div.yellow h3, div.yellow h4, div.yellow h5, div.yellow h6 {
  color: #cfcd13;
}

div.shieldalert {
  background-image: url(../images/div/info-shieldalert.png);
}</pre>

Upvotes: 0

Views: 456

Answers (2)

smack0007
smack0007

Reputation: 11356

I've also found that when you have trouble with stuff flickering / peek-a-boo(ing) it is sometimes helpful to put a height:1%; on it. I often make a rule:

* html .ie6-fix
{
     height: 1%;
}

And then apply the class to anything that's giving me trouble in ie6. This will be ignored in browsers besides internet explorer anyways.

Upvotes: 2

Blixt
Blixt

Reputation: 50197

Could it be the IE6 peek-a-boo bug?

Try including this script: Dean Edwards' IE8.js script. It fixes the peek-a-boo bug and several others, and makes IE6 (and IE7) behave much more like an up-to-date browser. Have a look at the list of things it fixes/implements.

You need to include ie7-squish.js to fix the IE6 bugs, by the way.

Upvotes: 0

Related Questions