Network Security Internet Technology Development Database Servers Mobile Phone Android Software Apple Software Computer Software News IT Information

In addition to Weibo, there is also WeChat

Please pay attention

WeChat public account

Shulou

How to solve the problem that IE6/7 absolute positioning elements mysteriously disappear or are obscured?

2025-04-08 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >

Share

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

This article will explain in detail how to solve the problem of mysterious disappearance or occlusion of IE6/7 absolute positioning elements. The editor thinks it is very practical, so I share it with you as a reference. I hope you can get something after reading this article.

1. When the width of the floating layer adjacent to the absolute positioning layer is not equal to the width of the parent layer, and when the floating is not cleared, the IE6/7,FF shows consistent

two。 When the width of the floating layer adjacent to the absolute positioning layer is not equal to the width of the parent layer, when there is a clear float, IE6/7 does not display the absolute positioning layer, and FF displays

3. When the width of the floating layer adjacent to the absolute positioning layer is equal to the width of the parent layer, and when the floating is not cleared, IE6 does not display the absolute positioning layer, and IE7/FF displays

4. When the width of the floating layer adjacent to the absolute positioning layer is equal to the width of the parent layer, when there is a clear float, IE6/7 does not display the absolute positioning layer, and FF displays

The solution to this BUG is also simple, just let the absolute positioning layer not be placed next to the floating layer, and there is an easier way to add a blank div between the absolute positioning element and other elements.

Let's take a look at the mysterious disappearance and occlusion of absolute positioning elements, and first take a look at several positioning features involved:

1. The default value of z-index for relative positioning elements is 0.

two。 When two relative orientations occur at the same time, the z-index at the bottom of the code takes precedence.

3. The child follows the zindex set by the parent; if the child sets absolute positioning and z-index, it can break through the parent display

Look at the following code:

The code is as follows:

Code explanation: the above are three adjacent relative positioning layers, and a relative absolute positioning layer is added to the first layer. according to theory, this absolute positioning element is on top of three relative positioning elements, but it is not shown in practice. Trying to set the z-index value is not valid either.

The method of solving this bug on the Internet generally uses hack to make B negative to lower the level of B under IE. However, when the z-index is negative, this method produces a new ie bug according to the positioning characteristics, and the bug of ie can be avoided.

On the surface, the lower layer obscures the upper absolute positioning layer, but in fact, the lower layer obscures the absolutely positioned parent layer, as long as the z-index setting of the parent layer is greater than the later layer.

This is the end of this article on "how to solve the problem of mysterious disappearance or occlusion of IE6/7 absolute positioning elements". I hope the above content can be of some help to you, so that you can learn more knowledge. if you think the article is good, please share it out for more people to see.

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.

Views: 236

*The comments in the above article only represent the author's personal views and do not represent the views and positions of this website. If you have more insights, please feel free to contribute and share.

Share To

Development

Wechat

© 2024 shulou.com SLNews company. All rights reserved.

12
Report