html高度由子元素决定语句,css-绝对定位能使高度不定的父DIV的子标签高度100%显示...

经自己测试，绝对定位能使高度不定的父DIV的子标签高度100%显示，IE7+，firefox，chrome等浏览器均是如此，但是IE6却不鸟！

测试代码：

绝对定位与高度100%显示

body{font-size:84%;}

.test_a{width:30%; height:300px; border:1px solid #069; position:relative;}

.test_b{width:30%; border:1px solid #069; position:relative;}

.abs_a{position:absolute; width:150px; height:100%; top:0; bottom:0; background:#09C;}

.abs_b{position:absolute; width:150px; left:0; top:0; bottom:0; background:#09C;}

-------------------------------------------------我是分割线，哦也！-------------------------------------------------------

绝对定位

绝对定位

结果：

从实例可以看出：

1、如果父DIV高度固定，直接一个height:100%;就可以实现各个浏览器的高度100%显示(经自己测试，使用top:0; bottom:0;可以使IE6以外的浏览器高度100%显示)；

2.当父标签高度不定时，则使用top:0; bottom:0;可以使IE6以外的浏览器高度100%显示(如果仅仅使用height：100%，也能实现IE6外的子标签高度100%的显示，但是位置有差别，本实例中，IE下是绝对定位层在图片后面，chrome，opera，firefox等在下面)：

IE下，尤其IE6下绝对定位层更像是一个不守规矩的普通层一样，一个普通层与真正意义上的绝对定位层的杂交种，继承了很多普通层的特性，受限于父DIV宽度，无法实现height:100%(就像个普通层一样)。

想要解决这个问题，css估计力不足！

用js可以解决这一问题，

很简单的一句话：

结果IE6下：

(完)