zindex not working in IE

Question

I have div with tranparent drop down,it acts as suggest box.Below this i have two input boxes.Whenever i call this suggest box,it overlaps other two input boxes. iam trying to control this using zindex property and position elements,But is is not working.

Any help appreciated.Thanks in advance.

After applying z-index,i didn't see my controls in jsp page. Below is the code:

<tr>
<td colspan="2">firstname</td>
<td colspan="2"><table cellspacing='0' cellpadding='0' border='0' style='position:relative;float:left;'>
<tr><td width="25%" style="position:relative;z-inedx:999'>
<input type="text" name="firstname">
</table></td></tr>
</td>
</tr>
<tr>
<td colspan="2">lastname</td>
<td colspan="2"><table cellspacing='0' cellpadding='0' border='0' style='position:relative;float:left;'>
<tr><td width="25%" style="position:relative;z-inedx:1'>
<input type="text" name="lastname">
</table></td></tr>
</td>
</tr>

<tr>
<td colspan="2">middlename</td>
<td colspan="2"><table cellspacing='0' cellpadding='0' border='0' style='position:relative;float:left;'>
<tr><td width="25%" style="position:relative;z-inedx:1'>
<input type="text" name="middlename">
</table></td></tr>
</td>
</tr>

On chnage of firstname value ,i am displaying div content,it overlapping other two input controls. Regards, Raj

This question appears to be off-topic because it is just a typo. — Kuba hasn't forgotten Monica, Sep 14 '13 at 18:26

score 3 · Answer 1 · answered Oct 02 '12 at 02:30

3

Your code seems to be using z-inedx.

answered Oct 02 '12 at 02:30

Talik

103
7

good one... true thought... Funny that nobody else noticed.. :P – Joe DF Oct 02 '12 at 03:54

score 2 · Answer 2 · edited Nov 01 '12 at 13:23

2

You spelt z-index incorrectly: you have written inedx.

edited Nov 01 '12 at 13:23

Kjuly

34,476
22
104
118

answered Nov 01 '12 at 13:04

Jason Carty

1,247
2
13
17

score 1 · Answer 3 · answered Mar 10 '11 at 01:06

1

Can you post some code? Also make sure that all of the elements you are trying to utilize z-index on are positioned (they are using the position attribute {relative, absolute}), z-index only works on positioned elements.

answered Mar 10 '11 at 01:06

John

1,530
1
10
19

score 1 · Answer 4 · edited May 23 '17 at 12:22

1

I answered a similar questions at bgiframe with jQuery UI 1.8.9 Dialog and jQuery 1.5. You need to set the parent element to position:relative, and also give it a z-index similar to the suggest box which is a child element. This will do the trick for IE.

edited May 23 '17 at 12:22

Community

1
1

answered Mar 10 '11 at 02:58

Hussein

42,480
25
113
143

score 1 · Answer 5 · answered Mar 10 '11 at 08:19

1

Yes. When i had this issue, Position:relative; worked for me. you need to set that also.

answered Mar 10 '11 at 08:19

themajiks

420
1
8
23

score 0 · Answer 6 · answered Mar 10 '11 at 01:15

0

Z-index is only compatible with sibling elements. Is that your issue?

answered Mar 10 '11 at 01:15

scottheckel

9,106
1
35
47

zindex not working in IE

6 Answers6