In multiline mode the textbox does not respect CSS attributes

When setting Multiline=true, CssClass and HtmlAttributes properties are assigned to to the span wrapping the textarea and therefore the textarea does not respect them.  I am trying to set the height of the multiline textbox.

First I tried styling like this:

<SfTextBox Multiline="true" CssClass="text-multiline".....

And the style:

.text-multiline {
     height: 300px;
}

That had no effect even though inspecting the element I can see the surrounding span carrying the class of "text-multiline" and having the height of 300px;

I then tried to add  HtmlAttributes="@(new Dictionary<string,object> { { "style", "height: 300px;"} }) to my SfTextBox component.  Once again, the attribute got set to the span surrounding the textarea and had no effect on the textarea's height.

This is a pretty serious bug.  For now I am switching to native Blazor InputTextArea component.  Please fix in the next release.

2 Replies

SP Sureshkumar P Syncfusion Team May 18, 2020 11:58 AM UTC

Hi Edward, 
 
Greetings from Syncfusion support.  
 
Based on your shared information, we suspect that you want to render the multiline text box component with 300px height. We would like to say this in our CssClass property apply the given class to our parent element. so, we suggest you apply the height style property with traverse the textarea component as like below code example to resolve the issue.  
 
<SfTextBox ID="login" Multiline="true" CssClass="text-multiline" /> 
<style> 
    .text-multiline textarea{ 
        height300px !important; 
    } 
</style> 
 
 
Could you please check the above code example and let us know whether this is fulfilling your requirement or get back to us if you need further assistance. 
 
Regards, 
Sureshkumar P


BN bac nguyen May 30, 2023 10:03 AM UTC

êtrt

tẻt


Loader.
Up arrow icon