The min-height
property sets the minimum height of an element, as its name suggest. This means a height that is used unless nothing requires a larger height. For a textarea
element, the default height is determined by the number of rows (specified by the rows
attribute, which is defaulted to 2 by browser practice and by HTML5 CR) and by browsers’ calculation of line height.
Thus, you can set min-height
even to 10px, and it works as defined – the actual height is larger, but that follows from the definition.
To set the height, you would use the height
property, as in your example, and/or the rows
attribute, which indirectly sets the height. As usual, it sets the content height. The total height of a textarea box is content height plus top padding plus bottom padding plus top border plus bottom border.
It is difficult to imagine a situation where it would make sense to set textarea height to 10px, which is not enough for even one line of text in a size that is legible to most human beings. Moreover, if you really want to have an input box that is one line tall and is not resizable, an input type=text
element would be a much more practical and much more logical choice than textarea
.