How to make text area to be height of 10 rows fixed?

问题

How to make text area to be height of 10 rows fixed ? I put like

<label for="textarea" style="font-weight: bold;">Message Content:</label>
<br/>
<textarea cols="40" rows="10" class="ui-input-text" name="textarea" id="textarea" placeholder="Enter Message"></textarea>

but it is not 10 rows height when page loads and it is resizable.

回答1:

It is only resizable in browsers that allow it to be resized. You can prevent it with this CSS:

textarea
{
    resize: none;
}

Whereas regarding the height not being 10 rows, I suspect that it is because the 10 row height is calculated for the original style and if you've changed the style to a different font and/or font-size, and added padding, it may not match. Try setting the height to, say, 10em or 10em + padding.

回答2:

with resize: none;

If the height is not right, try to set it with css maybe

<textarea style="resize: none;" cols="40" rows="10" ...

回答3:

you can try:

resize:none;
height: 320px;
max-height: 320px;

works for me

来源：https://stackoverflow.com/questions/17077267/how-to-make-text-area-to-be-height-of-10-rows-fixed