Textarea with a padding of 12px adds extra line

[kjvdven]

I have a textarea with a padding of 12px and I get 2 lines instead of 1, the extra expands with the textarea and is always visible.

This does not happen when I remove the offset in the code (line 60).

[JacobDB]

This is happening for me as well, driving me crazy. This script looks awesome, but I can't get the sizing on textareas right -_-

[JacobDB]

Trying to figure this out. So far, I've got it working initially with:

if (element.scrollHeight == offset) {
    element.style.height = element.scrollHeight + "px";
} else {
    element.style.height = element.scrollHeight + offset + "px";
}

But once it hits a second line, it's still being wonky. I think it might be related to box-sizing, checking now...

[JacobDB]

Verified it's only happening on textareas with box-sizing: border-box;, box-sizing: content-box; seems to work just fine. This workaround is fine for me for now, but I'll try and actually fix this and submit a pull request.

[JacobDB]

Bit more progress on this: It seems that removing +offset for textareas with the border-box style fixes the issue on load, but as soon as it heights a second line it needs to scroll. Don't have time to research a proper fix just now, hopefully will revisit it later...