IE6 1px gap on absolute elements

IE6- 有一个非常讨厌的 bug，当绝对定位元素的父元素高或宽为奇数时，bottom 和 right 会获取错误。
HTML

<div class="outer height199">
<p>This container has a height of 199px and width of 199px</p>
<div class="inner">img</div>
<div class="inner2">img</div>
</div>
<div class="outer height200">
<p>This container has a height of 200px and width of 200px</p>
<div class="inner">img</div>
<div class="inner2">img</div>
</div>

CSS

.outer{
width:200px;
background:red;
margin:10px;
position:relative;
float:left;
display:inline;/* ie double margin fix*/
}
.height199{height:199px;width:199px;}
.height200{height:200px;width:200px}
.height201{height:201px;width:201px;}
.height202{height:202px;width:202px;}
.height203{height:203px;width:203px;}
.height204{height:204px;width:204px;}
.height205{height:205px;width:205px}

.inner,.inner2{
width:30px;
height:30px;
position:absolute;
background:blue;
}
.inner{
bottom:0;
left:0;
}
.inner2{
top:0;
right:0;

}
p{clear:both;margin:0 40px 1em 5px}

可以看出在奇数容器下出现了1px 间距，而在偶数容器下正常。
不完美的解决方法：改变结构并使用浮动
HTML

<div class="fix">
<div class="outer height199">
<div class="inner2">img</div>
<p>This container has a height of 199px</p>
</div>
<div class="inner">img</div>
</div>
<div class="fix">
<div class="outer height200">
<div class="inner2">img</div>
<p>This container has a height of 200px</p>
</div>
<div class="inner">img</div>
</div>

CSS

.fix {
width:200px;
margin:10px;
position:relative;
float:left;
display:inline;/* ie double margin fix*/
}
.fix .outer{margin:0}
.fix .inner{
clear:both;
margin-top:-30px;
position:relative;
float:left;
}
.fix .inner2{float:right;position:static}

How to Fix the IE6 Select Box z-index Bug

This is my first time experienced the IE6 z-index bug where a simple select box will always take priority over any predefined z-indices and always show up on top. see the screenshot:


I did search around and luckily discovered that there is a fix -JQuery plugin which by using an iframe and expanding it over the select box area, the iframe will take precendence over the select box. This JQuery plugin will automatically create the iframe for you. The plugin is simply called bgiframe and using it is quick and easy. Just include the script and attach the bgiframe() method to all of your floating layers. Here is a short and quick example:

<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.bgiframe.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
$('#floating_div').bgiframe();
}
</script>
</head>
<body>
<select>
<option>Test</option>
</select>
<div id="floating_div">I'm over this select box</div>
</body>

Now those nasty z-index bugs won’t ever trouble you ever again.

Twitter avatar IE6 must die

有人发起的一项Twitter签名活动，通过在自己的Twitter头像上添加一个小的“IE6 must die”的小图标来加速IE6的死亡。

尽管这对IE6市场份额没有太大的影响，但是，只要是能够推动IE消亡的事情，就是我必须支持的。

目前已经有将近4000人参加了这个活动。事实上，昨天，“IE6 must die”已经成为Twitter最热门关键词之一。

点击这个链接，参加此活动。

注：在该页面只需用你的Twitter帐号登录一下，就可以自动的在你的Twitter头像上添加一个小图标。

April Fool’s joke on IE6

SaveIE6.com was put together as an April Fool’s joke by the uptime monitoring service Pingdom. Due to the tremendous interest it has received they have decided to keep the site up and running.

Here are some highlights:

These days we are inundated with bloated web browsers that overcomplicate our lives. However, there is one eminent exception: IE6. It has been around since 2001 and is still one of the most powerful and versatile browsers available.

This is why we want to achieve the following:

• Get everyone to use IE6
• Get IE6 ported to more platforms
• Get the W3C standard changed to fit IE6

There are a few selected quotes from the petition page, I especially enjoyed this one below, hope you enjoy the great feedback and for enjoying the irony!

Without IE6, a 40 hour web design project might only be a 30 hour web design project. Please don't put me out of work in this economy.

Transparent PNG in IE6 with CSS Hacks

IE6 is evil for web developers, we all know about PNG transparency and its problems with IE6.

Say your CSS code looks like this:

#logo { background: url(images/logo.png) no-repeat left top;}

Next, we would follow that with an IE-specific hack.
As it turns out, IE5.5 and IE6 think that it’s possible have an element above the HTML element. Fortunately, all other browsers on the planet know better, so they skip the next rule because it says: For all elements (*) with this selector path starting above the HTML element, do this.
And this is where we’d add our IE-specific alpha transparency filter.

* HTML #logo {/* PNG Alpha IE Win ONLY */ filter: progid:DXImageTransform.Microsoft.AlphaImageLoader (src='images/logo.png', sizingMethod='scale');}

What we’ve done here is display a transparent PNG natively in all browsers except for IE6, and displayed the same graphic via a proprietary alpha filter only in IE6.

Another way to fix the problem.

see here:http://www.twinhelix.com/css/iepngfix/

IE6 must die

I've just been working on a website development, everything works perfectly acrross different browsers but IE6. It occurred to me how much easier my life would be if IE6 would kindly die.

On this particular job I would estimate that about 20% of my time has been spent tweaking for IE6's favor. What a waste of time! But I have to, still 30% traffic for Stuff.co.nz come from IE6. What a pain in the arse!

If you’re still using IE6, please, please, please upgrade your browser or use Firefox or Chrome.

Below are100 reasons why I hate Internet Explorer 6

var i=1;

for (i=1;i<=100;i++) {

document.write(i + "Bad CSS rendering ");

}

Time to phase out IE6???

As a web developer, here are top 10 reasons why users should abandon IE6

Top 10 reasons to switch from Internet Explorer 6:
1. Switch to a more secure browser.
2. Get a faster browser.
3. Web pages will look better.
4. Use a browser that it's not closely integrated with your operating system.
5. Try a browser that has native support for Ajax.
6. Open less windows by using tabs.
7. Get a search box without installing toolbars.
8. Get anti-phishing protection.
9. Web developers will thank you.
10. If IE6 is no longer a popular browser, developers will spend more time releasing new features.