Issue Using RadzenTextArea in a responsive RadzenGrid

Radzen.Blazor Components
1

Hello All,

I am currently using a RadzenTextArea in a column of a RadzenGrid. When the page has full desktop width, the TextArea displays as intended, as below:

image

However, when I collapse the width down to "phone/pad" width, the grid display is shown in the mobile width style, and the TextArea displays in a very truncated fashion, as below:

image

The markup defining the column is given below:

        <RadzenGridColumn TItem="SketchItem" Property="Title" Width="40%" Title="@PageResources["ColumnHeaderTitle"]">
            <Template Context="sketch">
                <RadzenTextArea @bind-Value="sketch.Title" ReadOnly="true" Style="width:100%; display: block" Rows="1" MaxLength="@SketchItemTable.Title.Length" />
            </Template>
            <EditTemplate Context="sketch">
                <RadzenTextArea @bind-Value="sketch.Title" Style="width:100%; display: block" Rows="1" MaxLength="@SketchItemTable.Title.Length" />
            </EditTemplate>
        </RadzenGridColumn>

My goal is to have the TextArea be the full width of the panel in mobile width (as a normal text box would be displayed if it was used instead). I have tried various styling strategies, however, none of my changes seem to have any effect on the display of the TextArea in the mobile width case.

Is there any way to apply styling (or other strategy) to accomplish this goal?

2

I'm working on a similar issue, trying to have Height be dynamic to the size of string load into the TextArea