John On Web Stuff

24-bit PNG Support

For all of us that have to deal with the massive pain that is Internet Explorer 6 – there is now finally a way to get 24-bit Alpha-Transparent PNGs to work in IE6. And all it takes is a few lines of code, ideally you’d insert these in between some conditional comments.

<script type="text/javascript" src="DD_belatedPNG.js"></script>
<script type="text/javascript">
    DD_belatedPNG.fix('.png_bg');
</script>

One major advantage is that you can use the background-position and background-repeat properties when using this method.

It does have a few limitations, but hopefully these will be resolved shortly.

DD_belatedPNG: better PNG background-image support in IE6

Rounded corners too!

From the same developer comes a solution for rounded corners in IE6 and IE7. The method involves a JavaScript function call that will add the rounded corners to the box you want to apply it to.

<script type="text/javascript" src="scripts/DD_Roundies.js"></script>
<script type="text/javascript">
  DD_roundies.addRule('.box', 10);
</script>

This call will insert some CSS so that Mozilla/Webkit browsers have a border radix added and a proper border-radius property for CSS3 compliant browsers.

For IE6 and IE7 it will add some VML code to allow these browsers to have rounded corners on boxes.

DD_roundies: Another (better?) round-corner HTML box concept