DIV and zIndex

zz2uk1

Im trying to show a text box above a div in a simple webpage.
Im viewing in IE 7 and Chrome and the text box is always below the div, although I have set the zIndex fairly high.
I have included my code.

Expand|Select|Wrap|Line Numbers

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml" > 

<head> 

<title>Untitled Page</title> 

<style type="text/css"> 

#Text1 

{ 

width: 244px; 

} 

</style> 

</head> 

<body> 

<div id="myMainDiv" style="BORDER-RIGHT: 1px; BORDER-TOP: 1px; BORDER-LEFT: 1px; WIDTH: 800px; BORDER-BOTTOM: 1px; POSITION: relative; HEIGHT: 600px; BACKGROUND-COLOR: buttonface;" > 

<div id="myChildDiv" style="DISPLAY: inline; FONT-SIZE: 8pt; LEFT: 74px; WIDTH: 320px; COLOR: windowtext; FONT-FAMILY: Arial; POSITION: absolute; TOP: 12px; HEIGHT: 212px; BACKGROUND-COLOR: #c0ffff" tag=""></div> 

<input id="Text1" style="z-index: 1000" type="text" /> 

</div> 

</body> 

</html>

zz2uk1

I have it.

I set my zIndex on my nested Div to be -1 and it all worked.

Markus

Glad you got that sorted.

Remember when you post code in the forums to wrap it in [code] tags. Simply highlight the text to be formatted, then hit the # button on the menu.

Thanks.

DIV and zIndex

re: DIV and zIndex

re: DIV and zIndex

Similar HTML / CSS bytes

/bytes/development

/bytes/it

/bytes/about