Users in UI face common problems of compatibility between the different browsers.  Many of the times there is no reasonable way to accomplish a desired layout in all major web browsers. Here I have come out with some CSS hacks collected together for some browsers. Hacks should be avoided whenever possible, but there are some situations require hacks to be used.

Internet Explorer

!important (Hide from IE 6)

This hack allows you to hide property from IE 6. Lets have a below example:

body{
         background:red !important;
          background:blue;
}

IE 6 background color should be blue but in all major browsers other than IE it must be red color.
!important property is not readable by IE. But all major browsers can read it has the property as important.

Underscore (_) and hypen (-)  (Hide from other browsers and apply to IE)

You can hide property from all browsers and show in IE. Let’s have an example

body{
         background:blue;
         _background:red;
}

In above example background blue is applied for all major browsers. Now second statement has underscore (_) at start. So the other major browsers don’t read it. But IE family browsers read it and overwrite the property. So blue background is set to all major browsers and red background is set to IE family browsers. Remember that you can also use hyphen (-) or asterisk (*) in place of underscore (_). Normally this kind of hack is used for margins or padding problems in IE.

Opera

First child selector hack (Show only to opera and hide from other browsers)

Normally when you need to use some css property only for Opera and hide from other browsers then you may use following code.

#menu ul {margin-top:4px;}
html:first-child>b\ody #menu ul {margin-top:0;}

The first #menu ul style sheet is applied by all of the major browsers. Second the css is breakable and not read  by all other major browsers and now it is read only opera.

Safari and Chrome

Webkit hack

Hack can be used to hide from all other major browsers which are not using webkit. But browsers which use webkit as engine can use the style sheet. So normally opera, chrome and safari comes under this category. But since Opera 9.50 it was not affected. So only chrome and safari can use see the hack.

body{  padding3px; }

@media screen and (-webkit-min-device-pixel-ratio:0) {
           body { padding : 5; px}
}

padding 5 is applied apply chrome and safari, otherwise all other major browsers apply 3px as padding for body.
I found this safari hack at http://themechanism.com/blog/2008/01/08/safari-css-hack-redux/