Declined
Last Updated: 21 Feb 2022 07:25 by ADMIN

I made a repl to show the issue: https://blazorrepl.telerik.com/GcaGvdaw31AartTh17

The 3 differently sized text area's render with almost the same size. Inspecting the elements, the textarea is wrapped in a span which is given a k-input-[sm/md/lg] class, and the text area is given minorly different padding for each. This works fine for TextBox, but not what you would expect from textarea.

I would expect textarea to render 1 line for sm, 2 lines for md, and 4 lines for lg, or something similar. The padding is a fairly useless difference here for a text area.

Declined
Last Updated: 25 Jan 2022 16:22 by ADMIN
Scheduled for 2021.3
Created by: Avrohom Yisroel
Comments: 0
Type: Bug Report
1

Adding the form-control class from bootstrap to a textarea causes worng appearance especially when I have autosize set to true.

---

ADMIN EDIT

Here is a workaround:

<style>
    span.k-textarea.form-control {
        border: 0;
        box-shadow: none;
        width: 100%;
        height: auto;
    }

        span.k-textarea.form-control textarea {
            border: 1px solid rgb(206, 212, 218) !important;
            border-radius: 0.25rem !important;
           
        }
</style>

<TelerikTextArea @bind-Value="@theValue" Class="form-control" AutoSize="true" />

@*<textarea class="form-control" @bind="theValue"></textarea>*@

@code{
    string theValue { get; set; } = "one\ntwo\nthree\nfour";
}

---

Declined
Last Updated: 25 Jan 2022 16:04 by ADMIN
Scheduled for 2021.2
I am using the material theme and when text is typed in the textarea the floating label does not flush to the top of the component but overlaps the text.
Declined
Last Updated: 28 Mar 2019 11:32 by ADMIN
ADMIN
Created by: Rumen
Comments: 4
Type: Feature Request
9
Let us know whether do you need Office 365-like skin?