Div + CSS sets the page center of the DIV module, which is compatible with IE6 +, ff3.0 +, and chrome

To obtain the following page effects, for example, the position control for the mask layer:

PageCode:

 
<DivClass= "Divouter"> <DivClass= "Divinner">Divinner is the center block on the page.</Div> </Div>
 

 
After several attempts, we finally adopted the following solution (not compatible with ie5.5 ):
 

 . Divouter { Position :Relative ; Margin : 0 auto ; /* Ie5.5 not supported */  Margin-top : 25% ; /* If it is set to 25%, the distance from the top margin is half of the page height, which is not understandable. This is true for chrom, ff, and IE6 */  Width : 300px ; Height : 200px ;} . Divinner { Position :Absolute ; Top : -50% ; Width : 300px ; Height : 200px ; Background : # Dedede ;}