html control gets hidden behind aspx controls
Question
Please check the attached link in which i have attached screenshot. The html dropdown gets hidden behind the aspx dropdowns that i created. Is there any solution to make the dropdown list be seen on top of the aspx controls? http://img23.imageshack.us/img23/2553/imageydn.jpg Thanks in advance, Geetha
2 answers
solution1
0 2009-08-05 09:42:48
尝试使用z-index ，尽管您必须设置position：元素的绝对值。
solution2
0 ACCPTED 2009-08-05 09:43:13
You've hit a rather nasty issue with the html drop-down listin IE. In short, it will always sit on top of most other controls, no matter what you set z-index to . There is no css way I know of to fix this easily.
However, the one thing that a drop-down list does not "leak through" is an IFRAME. The trick I usually use is to put an IFRAME underneath your drop-down "menu" and you should find the drop-down list no longer leaks through.
Nasty - but this is a long term IE gripe!
[Edit: to add an example, and also rephrase "put your drop-down 'menu' in an IFRAME"]
The following example illustrates the trick:
<html>
<head></head>
<body>
<div style="z-index:1">
<iframe style="position:absolute; height: 200px; width: 100px; z-index: 1"></iframe>
<div style="position:absolute; background: pink; height: 200px; width: 100px; overflow:hidden; z-index: 2">
Lorem ipsum dolor sit amet
</div>
<br/>
<select style="z-index: 0;width: 200px">
<option>option1</option>
<option>option2</option>
<option>option3</option>
</select>
</div>
</body>
</html>
Note that if you remove the iframe from this example, you see the "leak through" problem re-appear.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.