How to get the height of the text inside of a textarea

Question

I have a textarea with the the text Hello World. I would like to get the height of this text.

I\'ve tried to use:

var eleme         


        

Answer 1

I am not sure whether I interpret your question correctly, but I personally needed to know the exact height of each line of text. The line-height property does not have the right value (for example, in Safari, it will be rounded to the closest value when actually printing text).

This is my workaround. You should have the following code somewhere at the beginning of the document.

// set one row in the textarea and get its height
element.rows = 1;
var height1 = parseFloat(window.getComputedStyle(element)["height"]);
// set two rows in the textarea and get its height
element.rows = 2;
var height2 = parseFloat(window.getComputedStyle(element)["height"]);
// Now, the line height should be the difference
var inputLineHeight = height2-height1;

The variable inputLineHeight should contain the correct value, in pixel.