Textarea text area width and height width and height automatic adaptation implementation code

Copy code

The code is as follows:

<HTML>
<HEAD>
<TITLE>Textarea width and height automatic adaptation processing method</TITLE>

<style type="text/css">
.comments {
width:100%;/*Automatically adapt to the width of the parent layout*/
overflow:auto;
word-break:break-all;
/*Solve the line break problem in IE (prevent it from being automatically displayed in one line, mainly to solve the IE compatibility problem. In IE8, when the width is set to 100%, if the text field capacity exceeds one line,
When we double-click the text content, it will automatically change to a single line, so we can only use IE's proprietary line break properties "word-break or word-wrap" to control its line break)*/
}
</style>
</HEAD>

<BODY>
<FORM METHOD=POST ACTION= " ">



<textarea class="comments" rows="10" cols="10"> </textarea>

<textarea class="comments" rows=1 name=s1 cols=27 onpropertychange= "this.style.posHeight=this.scrollHeight "></textarea>

<textarea class="comments" style="height:expression((this.scrollHeight>150)?'150px':(this.scrollHeight+5)+'px');overflow:auto;"></textarea>
</FORM>
</BODY>
</HTML>

<<: Three Discussions on Iframe Adaptive Height Code

>>: jQuery solves the problem of not executing the original event after adding elements