2010-09-13 139 views
0

我有這個textarea(它是展開後,點擊一個特定的按鈕),應該是該文本輸入字段。在FF和Chrome中,它正在工作。但不在IE(6 + 7)中。有沒有人有線索,問題在哪裏以及我如何解決?IE忽略zIndex

<html> 
<head> 
<style type="text/css"> 
.Tbl { width: 100%; } 
.Col1 { width: 10%; } 
.Col2 { width: 90%; } 

.CellTA { background-color: #00F; vertical-align: top; padding: 5px; } 
.DivTA { position: relative; } 
.DivTA2 { position: absolute; background-color: #FF0; padding: 5px; } 
.TA { position: relative; z-Index: 10; height: 50px; width: 200px; } 

.CellInp { background-color: #F0F; padding: 5px; } 
.DivInp { position: relative; width: 100%; background-color: #0F0; } 
.Inp { position: relative; width: 200px; } 
</style> 
</head> 
<body> 
<table class="Tbl"> 
    <colgroup> 
    <col class="Col1" /> 
    <col class="Col2" /> 
    </colgroup> 
    <tr> 
    <td>Ref</td> 
    <td class="CellTA"> 
     <div class="DivTA"> 
     <div class="DivTA2"> 
      <textarea class="TA"></textarea> 
     </div> 
     </div> 
    </td> 
    </tr> 
    <tr> 
    <td>eMail</td> 
    <td class="CellInp"> 
     <div class="DivInp"> 
     <input type="text" class="Inp"> 
     </div> 
    </td> 
    </tr> 
</table> 
</body> 
</html> 

預先感謝

編輯:添加填充和改變DivTA2的背景色

回答

4

IE對待z-index有點不同於其他瀏覽器。這些博客文章可能對您有所幫助:

http://annevankesteren.nl/2005/06/z-index

http://brenelz.com/blog/squish-the-internet-explorer-z-index-bug/

總之,我認爲你可能需要的z-index添加到具有它的人的父元素。 (我不完全確定是否將其添加到一個級別會起作用 - 如果這不起作用,您可以嘗試將它添加到祖父母元素中。)

+0

這就是解決方案!你讓我今天一整天都感覺很好 ;)。謝謝! – Prjio 2010-09-13 15:37:38

+0

@Prjio:很高興我能幫忙:) – 2010-09-13 15:38:46