Some Most Common Browser Compatibility Issues

        -moz-opacity: 0.6;

         opacity: 0.6;        
        

        .check{
         -moz-opacity: 0.6;
         -ms-opacity: 0.6;
         -webkit-opacity: 0.6;
         -o-opacity:0.6;
         opacity: 0.6;
        }       
        

4.Tips and tricks
The most important tips for every new and experienced developer are-

• Understand the difference between block and inline elements.
• Understand the effects of floating and clearing.
• Understand box model in CSS.
• Use reset property in CSS.

5.Css box model 
The CSS box model has some basic rules: 
     • Block-level elements are rectangular.
     • The dimensions of these block-level elements are calculated by using height, width, padding, margins, and borders.
     • If height is not specified, then a block level element will be high in accordance with the content it contains, plus padding.
     • If the width is not specified, a non-floated box will expand so as to fit the width of its parent element minus padding.

6.Multi-Column Layout
For multi-column layouts which are easy to maintain, using float property is the best method. Having a good understanding of how floats property work is, 
an important factor in achieving a cross-browser compatibility.

7. Some common issues
Let's see some most common problems 
     •IE6(Internet Explorer) will become problematic if CSS float property is overused
     •IE6(Internet Explorer) will double the margin value on the floated elements and setting display: inline property will solve this issue.
     •In IE6 and IE7(Internet Explorer), if an element doesn’t have a proper layout, it can cause many problems, including backgrounds invisible, margins              collapsing improperly,  and many more.
     •IE6(Internet Explorer) does not support minimum and maximum-based CSS properties like max-height, or min-width.
     •IE6(Internet Explorer) does not support fixed position property of background images.
     •IE6 and IE7(Internet Explorer) do not support any alternate values for the display property of CSS. 
     •The: hover pseudo-class cannot be used on any element in IE6 except an anchor tag (<a>).
     •Some versions of IE have less support for certain selectors (e.g. child selectors) 
     •IE versions 6-8 have very little support for CSS3.