Perfect CSS Columns with DIV tag

So many times I was looking for a good reference to create my multi column page layouts using DIV tags with floating technique.By using each method I had some problems with different mass of contents in columns, but this one was the best solution to create same height multi columns pages using div tag.

/* Start Mac IE5 filter \*/
#block_1, #block_2, #block_3 {
padding-bottom: 32767px !important;
margin-bottom: -32767px !important;
}
/* End Mac IE5 filter */
#wrapper{
overflow: hidden; /* This hides the excess padding in non-IE browsers */
}

Please leave your comments if you know a better reference.

PNG stories & IE

There are several issues I have faced with when I was using PNG images on my pages. “PNG is a multichannel support image format that can provide transparency for designers.” Internet Explorer does not support transparency for PNG files in versions bellow 7.0 and this is so ridicolous. Specialy when you are using it as a background image.

First of all let see how can we enable the PNG transparency features in IE,

The Solution :

To see the issue clearly, see this sample. the solution is explained in this link clearly. all you need to do is to have a reference to the javascript code
this code searchs for all png references in your html code and apply the fix on it.

Next issue causes when you use transparented PNG images on the background of any HTML element. In this case all the focusable elements on the page will go under an invisible layer and you can not use mouse to click on them.

The Solution :

simply move your clickable elements on your page on a higher z-order and detach them from the current parent element by using CSS.

here is a sample:

a,input,select,button{
z-order:2;
position:relative;
}

using relative positioning may cause some visual problems in IE 5.x for these elements to prevent this use position:absolute for your parent page wrapper in your HTML code.

#pagewrapper{
position:absolute;
margin-left:auto;
margin-right:auto;
}

Please leave your comments and tell us your experience with png compatibility problems in IE or other browsers.