2010-08-11 // Fixing the lack of support for transparent PNG images in Microsoft Internet Explorer 6: my favorites
It is an old problem, but still actual: MSIE 5.5/6 does not support alpha channel transparency in PNG (at least in PNG-24). If you google it, you will get many results. The reason why I am blogging about is the different quality and heaviness of the thousands of existing fixes, it is not easy to know which are the good ones if you never used them. Therefore I want to share my personal favorites. I'm creating websites for years now, and there are two freely available fixes which always did the job for me:1)
2010-05-28 // Microsoft Internet Explorer 8: Fix the weird textarea scrolling bug
MSIE 8 brings some new, weird bugs. One of the most annoying one targets <textarea>s with a percentage value for the width CSS property (ironically in standards mode only, the problem disappears in IE7 compatibility view or quirks mode). When a textarea has got enough content to offer scrollbars and the user already scrolled a little bit, every keystroke will because a disturbing auto-scroll effect (even with flickering scrollbars under certain conditions like onkeyup/down events or border CSS property values). This is a real show-stopper which makes editing longer texts very uncomfortable for IE8 users.
The following file shows the problem. Simply download and open it with IE8.4)
- msie8-textarea-bug.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en" dir="ltr"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>MSIE8 textarea scroll bug/fail demo</title> </head> <script type="text/javascript">/*<![CDATA[*/ function checkMode() { var standard = false; if (document.compatMode) { if (document.compatMode === "BackCompat") { m = "Quirks"; } else if (document.compatMode === "CSS1Compat") { m = "Standards Compliance"; standard = true; } else { m = "Almost Standards Compliance"; } if (standard === false) { alert("ATTENTION: The document is being rendered in "+m+" Mode - there will be NO bug!"); } //alert("The document is being rendered in "+m+" Mode."); } } checkMode(); /*]]>*/</script> <style type="text/css"> textarea { height: 180px; width: 50%; /* this will trigger the bug */ } </style> <body> <form name="foobar" method="post" action=""> <textarea> Please scroll down a little bit and try to edit text. E.g. change the line by clicking into the text, type "asdf", go to another line, type "asdf" and so on. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. </textarea> </body> </html>
I don't know how to get rid of the flickering scroll bars,5) but there is a workaround for the automatic scroll effect:
- The bug is triggered by a percentage value of the CSS
widthproperty. - To get rid of it, you need to define a fixed px width.
- If you do not want to loose the possibility to use flexible widths for
<textarea>, you can get the needed percentage value through the back-door by usingmin-widthandmax-widthwith the same value afterwards. You may use browser specific hacks to hide/overwrite the fixed width from IE6 which is not affected by this bug but does not understandmin/max-width.
Example:
textarea { /* width for non-IE browsers */ width: 50%; /* width for IE NOTE: - "\9" at the end is a CSS hack to address only IE (all versions). - "#" in front is a CSS hack to address IE6/7 */ width: 500px\9; /* fix the bug */ /* get the needed percentage value in IE7 and IE8 */ min-width: 50%\9; max-width: 50%\9; /* get the needed percentage value in IE6 */ #width: 50%; }
Hope that helps. 
2008-02-05 // 204 = 1223
Die Gleichung sieht komisch aus, ist total falsch und macht keinen Sinn. Jedenfalls für einen normalen Menschen. Die Jungs die den Internet Explorer entworfen haben scheinen dies aber anders zu sehen.
Heute war ein wenig Ajax angesagt. Das Skript hat den HTTP-Status-Code einer XML-Antwortdatei abgefangen, welches bei einer gültigen Anfrage ohne Ergebnis keine Ausgabe bringt und nur den 204 Code sendet, welcher für no content steht – also genau die ggf. vorliegende Situation “gültige Anfrage aber kein Inhalt” beschreibt. Soweit so gut. Dies sollte nun abgefangen werden um direkt den darauffolgenden Request abzusetzen:
} else if (http_request.status == 204) {
*kabooom*. Hat überall funktioniert, nur im IE nicht. Nach einigem Debuggen staunte ich nicht schlecht, als ein
alert(http_request.status);
in jedem Browser 204 ausgab, im IE allerdings ein 1223 produzierte. Also schnell Google angeworfen und mal wieder die Bestätigung eingeholt, das der IE – auch in der Version 7 – ein Biest ist. Er nimmt sich nämlich einfach die Freiheit in machen Fällen den Status-Code von 204 auf 1223 umzuschreiben. Zum kotzen. Um ein zusätzliches
|| http_request.status == 1223
kam ich in dem Skript also nicht herum. 
