Last Updated: 21 Jan 2021 14:15 by ADMIN
Jens Magnus
Created on: 20 Jan 2021 12:09
Category: TextArea
Type: Feature Request
Textarea needs a height or rows property like the default textarea in html5 has

First, let me thank you for adding the Width in the latest update (2.21). Much appreciated! 



We need a fixed height for our text areas to encourage user-interaction and ease the UX for the end user. Having (now a wide), but very narrow description field is not ideal and since it's basically a feature of HTML5, I don't see why it be exempt from Blazor UI.

<TelerikTextArea Rows="10" Width="100%" />




1 comment
Svetoslav Dimitrov
Posted on: 21 Jan 2021 14:15

Hello Jens,

Thank you for the kind words regarding the Width of the TextArea, and I am happy to read that you are already using it!

What the rows HTML attribute does is to place a fixed height of the textarea (default HTML element). A row itself is a combination of font-size - the default for Google Chrome is 22px, padding, and margin which default to 0. If you have the rows attribute set to 10 the total height of the element would be 10 * 22 * the line-height or about 220-250 px. The height of the row is controlled by the line-height CSS property. To get a behavior similar to what you have using the rows attribute you can use the Class parameter exposed by the TelerikTextArea and cascade the height CSS property. Below, I have made an example that you can use as a base. 

    .custom-textarea-class {
        height: 250px;

<TelerikTextArea @bind-Value="@TextAreaValue" Class="custom-textarea-class"></TelerikTextArea>

@code {
    public string TextAreaValue { get; set; }

That being said, we believe that this is a valid feature request.

Svetoslav Dimitrov
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.