关于position在各浏览中的表现问题

关于css中的position在各大浏览器（IE,FireFox,Opera）中表现问题：

第一种情况：

<! DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
< html xmlns ="http://www.w3.org/1999/xhtml" >
< head >
< meta http-equiv ="Content-Type" content ="text/html;charset=gb2312" />
< title > 无标题文档 </ title >
< style type ="text/css" > ...
#div-1
{...}{
position:relative;
top:0px;
left:150px;
background:#CC9933;
border:1pxsolid#66FF66;
width:400px;
height:300px;
}
#div-1a
{...}{
position:absolute;
top:0;
left:0;
width:100px;
height:600px;
background:#9999FF;
}
.autoCenter
{...}{
margin:0auto;
border:1pxsolid#6595d6;
}
.clearBoth
{...}{
height:1px;
clear:both;
}
.divFather
{...}{
height:400px;overflow:scroll;border:2pxsolid#ccc;
width:600px;
}

.divA
{...}{
position:relative;

}
</ style >
</ head >

< body scroll ="no" >
< br />
< br />
< div class ="divFather" >
< div id ="div-1" >
< p > d </ p >
< p > dfd </ p >
</ div >
< div id ="div-1a" > df </ div >
< div class ="clearBoth" ></ div >
< div class ="autoCenter" >
< p > d </ p >
< p > &nbsp; </ p >
</ div >
< div class ="autoCenter" >
< p > d </ p >
< p > &nbsp; </ p >
</ div >
</ div >
<!--
<divid="div-1"class="divFather">
<divid="div-1a">
thisisdiv-1aelement.
</div>
thisisdiv-1element.
</div>
-->
</ body >
</ html >

(1)、IE中解释良好，ID为div-1的元素如期在其容器类名为divFather中，相对固定在某一个位置，通过这个功能做固定表头效果非常的方便。
(2)、而ID为div-1的元素在Opera和和FireFox中它会随着滚动条的而滚动，也就是说起不到relative 的作用。

第二种情况：

#div-1
{
position:relative;
top:0px;
left:150px;
background:#CC9933;
border:1pxsolid#66FF66;
width:400px;
height:500px;
}

我们将修改#div-1中的heigth属性，让它的高度高于其容器.divFather时，发现这时IE的解析与我想象中的不同
(1)、在IE中ID为div-1的元素突破了其容器而显示在外部，也就是说position:relative;中起不到相对于其容器的位置，而是相对于浏览器也就是窗口，在IE中设置position为relative时它与任何的元素是没有关联的，它的位置在哪也也不会影响到任何元素的布局。

(2)、Opera和FireFox中解析则不同，尽管position设为relative但它也只显示到其容器中。

来到这里我就想如果像第一种情况时浏览器解析得像IE，而在第二种情况解析得像Opera或FireFox那不是更好，更是我们想要看到的？

不如各高手有何解决的方法呢？？