height:100%在IE里面不起作用的解决办法

在FF,CHROME等一些高级浏览器,左右布局的,父级高度都会自动匹配子级高的那一个,但是在IE6里面则是不一样的解析方式。

如果在IE6里面想height:100%,就必须从某个层级定高,或者自html,body{height:100%;}。

笔者是遇见了这样的问题,希望定位一个箭头,并且该箭头要垂直居中,这就意味着要top:50%;margin-top:-height/2;但是父级高度应该是100%。

这个时候通常有两种做法:

一、加一个空div

<div>
<div style="float:left;height:100%;">pointer</div>
<div></div>
<div style="float:left">
<div style="height:200px;"></div>
</div>
</div>

不行的话请用第二种

二、全部定高

html,body{
height:100%
}
<div style="height:100%">
<div style="float:left;height:100%;">pointer</div>
<div style="float:left">
<div style="height:200px;"></div>
</div>
</div>