style.position: absolute在谷歌浏览器和IE上不同_跨浏览器开发

style.position: absolute在谷歌浏览器和IE下不同
<input type="text" /> 套在一个 div 里，设置 style.position: absolute
在IE下，这个文本框是相对于所在的div的绝对位置，但是在其它浏览器下，却是相对于浏览器窗口的绝对位置
如何达到的我目的？


<html>
<head>
	<script type="text/javascript">
	var currentTd = null;
	function focusTd(td){
		var txt = document.getElementById("txt1");
		
		txt.style.width = td.offsetWidth-1;
		txt.style.height = td.offsetHeight-1;
		txt.style.left = td.offsetLeft;
		txt.style.top = td.offsetTop;
		txt.style.display = "block"
		txt.value = td.innerText;
		txt.focus();
		txt.select();
		
		currentTd = td;
	}
	function leave(){
		var txt = document.getElementById("txt1");
		if(currentTd != null){
			currentTd.innerText = txt.value;
			currentTd = null;
		}
		txt.style.display = "none";
	}
	</script>
</head>
<body>
  <div id="divTest" style="width:300px; height:200px; border-style:solid; overflow-x : auto; overflow-y : auto; border-width:1px; border-color:black; background-color: pink; z-index:2">
	<table border='1' width="400px" bordercolor="black" style="border-collapse:collapse">
		<tr>
			<th style="width:200px">aaaaa</th><th style="width:200px">bbbbb</th><th>ccccc</th><th>DDD</th><th>EEE</th>
		</tr>
		<tr>
			<td style="width:60px" onclick="focusTd(this)">A1</td>
			<td style="width:60px" onclick="focusTd(this)">B1</td>
			<td style="width:60px" onclick="focusTd(this)">C1</td>
			<td style="width:60px" onclick="focusTd(this)">D1</td>
			<td onclick="focusTd(this)">E1</td>
		</tr>
		<tr>
			<td style="width:60px" onclick="focusTd(this)">A2</td>
			<td style="width:60px" onclick="focusTd(this)">B2</td>
			<td style="width:60px" onclick="focusTd(this)">C2</td>
			<td style="width:60px" onclick="focusTd(this)">D2</td>
			<td onclick="focusTd(this)">E2</td>
		</tr>
		<tr>
			<td style="width:60px" onclick="focusTd(this)">A3</td>
			<td style="width:60px" onclick="focusTd(this)">B3</td>
			<td style="width:60px" onclick="focusTd(this)">C3</td>
			<td style="width:60px" onclick="focusTd(this)">D3</td>
			<td onclick="focusTd(this)">E3</td>
		</tr>
		<tr>
			<td style="width:60px" onclick="focusTd(this)">A4</td>
			<td style="width:60px" onclick="focusTd(this)">B4</td>
			<td style="width:60px" onclick="focusTd(this)">C4</td>
			<td style="width:60px" onclick="focusTd(this)">D4</td>
			<td onclick="focusTd(this)">E4</td>
		</tr>
	</table>
	<input type="text" id="txt1" style="position: absolute; left: 2; top: 0; border-width:0; border-style:solid; border-color: black; z-index:1; display:none" onblur="leave()" />
  </div>
</body>
</html>

------解决方案--------------------------------------------------------