textarea IE6/7中設置百分比高度失效

時間 2021-01-20

大家好，我想讓textarea自適應容器的高度，設置height:100%

結果其他瀏覽器能自適應高度，就IE6/7不能,

望高手指點

<!DOCTYPE html>
<html>
  <head>
    <title>textarea.html</title>
    <meta http-equiv="content-type" content="text/html; charset=GB18030"/>
    <style type="text/css">
    	.div{width:200px;height:200px;border:1px solid #999;padding:10px;float:left}
    	.textarea{height:100%;width:100%;overflow:auto;border:1px solid #3164ac;
    		zoom:1;
    		display:block;/*都不能讓ie6、7的height:100%起作用*/
    	}
    </style>
  </head>
  <body>
	<div class="div">
	    <textarea rows="0" cols="0" class="textarea">textarea</textarea>
    </div>
	<div class="div">
	    <span class="textarea">span</span>
    </div>
	<div class="div">
	    <img class="textarea" alt="img"></img>
    </div>
	<div class="div">
	    <input class="textarea" value="input"></input>
    </div>
  </body>
</html>

其他瀏覽器顯示

IE6/7顯示

input和textarea無效，其他inline，inline-blcok元素都有效。

如果設置height:100px,IE6/7有效，只是設置百分比無效。

奇怪