Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Adjust the textArea height and width to fit in <td> of a table

Tags:

html

I am displaying the html content in a table. For printing the tags i am using textArea in the <td> of the table. So i want to adjust the height and width of textArea so that it is equal to the <td>. How can i do this

like image 952
user1275375 Avatar asked Jun 08 '12 05:06

user1275375


People also ask

How do I set the width and height of a TD table?

To set the cell width and height, use the CSS style. The height and width attribute of the <td> cell isn't supported in HTML5. Use the CSS property width and height to set the width and height of the cell respectively. Just keep in mind, the usage of style attribute overrides any style set globally.

How do I Auto Resize textarea?

height = 'auto'; to this. style. height = '0px'; and add a min-height to prevent the initial state from actually going to 0, scrollHeight will correctly return one row of height when appropriate.


1 Answers

dabblet.demo
enter image description here

the problem is that textarea behave not normal box-model, that's why we need this trick with box-sizing

this CSS will help you:

textarea {     border: none;     width: 100%;     -webkit-box-sizing: border-box; /* <=iOS4, <= Android  2.3 */        -moz-box-sizing: border-box; /* FF1+ */             box-sizing: border-box; /* Chrome, IE8, Opera, Safari 5.1*/ } 

if you have no access to css file, you can use inline css

like this:

<textarea style="border: none; width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;"> </textarea> 
like image 165
Vladimir Starkov Avatar answered Sep 18 '22 04:09

Vladimir Starkov