Z-index problems encountered in IE7 and solutions

web front end thirteen thousand six hundred and forty-nine 13 years ago (2011-07-18)

When writing CSS, in the case of position, clearly set the z-index to a high value, for example, z-index: 1000000; When running under IE7, the effect is often not what we want. No matter how high the z-index value is set, it is still blocked by the layer. This is the problem of IE7 rendering DOM. When we position the container of the parent layer (position: relative;), the z-index of the child layer will be reset no matter how high the value is set.

Now that the problem is found, we also know the solution. It is OK to add the z-index value to the parent layer. The z-index must be used together with position, otherwise it is invalid.

Finally, I found that sometimes writing the z-index attribute in the referenced CSS does not work. It should be written in the tag