Hi John,
Indeed, there is no built-in property which allows us to set the height of the Editor component. However, the dimensions can be changed with a custom CSS styles. I am not sure that I understand correctly which height should be changed - of the text area or the height of the whole Editor wrapper:
- to change the height of the Editor an inline CSS style can be used:
- to change the height of the content only, the following CSS can be used:
A common pitfall is to forget to set Angular's
ViewEncapsulation to
None as otherwise the custom styles will not be applied, unless they are provided at a global level.
Here is an example that demonstrates the described approach:
https://stackblitz.com/edit/angular-7nsj5z
Additionally, the initial height of the Editor can be set by using the
min-height CSS property. By design the Editor's <
div> tag, which holds the content, increases its height when the entered text reaches the bottom:
The following example demonstrates an Editor with set height, which auto-resizes according to the entered text:
https://stackblitz.com/edit/angular-7nsj5z-qrunci
As a side note, check the
Styling section of the Editor component:
https://www.telerik.com/kendo-angular-ui/components/editor/styling/
I hope this helps.
Regards,
Martin
Progress Telerik
Get
quickly onboarded and successful with your Telerik and Kendo UI products with the Virtual Classroom free technical training, available to all active customers.
Learn More.