Hierarchy (z-index) problems caused by negative margin values

This article mainly introduces the solution to the hierarchical (z-index) problem caused by negative margin values. Friends in need can refer to it. Let’s look at this piece of code first:

Copy code

The code is as follows :

Script Home

##Under IE6 and IE7, the inner layer The container is covered by the outer layer, as shown in the picture:

Under IE8 and ff, the outer container is covered by the inner layer, as shown in the picture:

Really Crazy, if you want to achieve the effect of IE8's outer container being covered by the inner layer, IE7 can solve the problem by triggering the inner layer's layout, but IE6 can't. You can only use position:relative in the inner layer to solve the problem. Of course, position :relative also solves the problem of ie7, because position:relative itself can trigger layout.
Look at the code:

Copy the code

The code is as follows:

Script Home

##Of course If you want IE8 and FF to achieve the effect of IE6 and IE7, you only need to add overflow:hidden in the outer layer. See the code

# #Copy code

The code is as follows:

< a href="http://www.jb51.net/" mce_href="http://www.jb51.net/">Script Home

The above is the detailed content of Hierarchy (z-index) problems caused by negative margin values. For more information, please follow other related articles on the PHP Chinese website!