Shulou(Shulou.com)06/03 Report--

This article shows you how to solve the problem of invalid div layer adjusting z-index properties, the content is concise and easy to understand, it will definitely brighten your eyes. I hope you can get something through the detailed introduction of this article.

Invalid z-index

In the process of doing this, I found a simple problem that many people should encounter. Setting the Z-INDEX property is not valid. In CSS, you can only change the level through code, and this attribute is z-index. For z-index to work, there is a small premise that the position attribute of the element is relative,absolute or fixed.

1. The first case (z-index does not work no matter how high it is set):

There are three conditions for this to happen:

1. The parent tag position attribute is relative

2. The question tag has no position attribute (excluding static)

3. The question tag contains a float attribute.

The eg:z-index level does not work, and floating will invalidate z-index. The code is as follows:

The code is as follows:

There are three solutions (any one will do):

1. Change position:relative to position:absolute

2. Add position attributes to floating elements (such as relative,absolute, etc.)

3. Remove floats.

two。 The second case

Under IE6, the performance of the hierarchy sometimes depends not on the z-index of the child tag, but on the level of the parent tag of the first relative attribute of the entire DOM tree (node tree).

Eg:IE7 and IE6 have the same bug, the reason is very simple, although the picture of div's current father level is very high (1000), but because the father's father is not useful, poor 9999 of such a strong child did not have the first day ah! The code is as follows:

The code is as follows:

Solution: add a higher level (z-index:1) to the first relative attribute, as follows:

The code is as follows:

The above content is how to solve the problem that the div layer is invalid to adjust the z-index properties. Have you learned the knowledge or skills? If you want to learn more skills or enrich your knowledge reserve, you are welcome to follow the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.