Is it possible to anchor the TextArea prefixComponent / suffixComponent to the bottom of the text area - so as the height of the TextArea grows and the content is scrolled, the components remain anchored to the bottom of the component, not the top?
Yes, it is. This should do it:
vaadin-text-area :is([slot="prefix"], [slot="suffix"]) {
top: calc(100% - 1lh);
}
Edit: okay, that should be close enough.
Note, that the line-height unit, 1lh, doesn’t work in older browser versions. Check support: types: `<length>`: `lh` unit | Can I use... Support tables for HTML5, CSS3, etc
If you need better support, replace that with something like 1.25em that matches the effective line-height.
Thank you!
That works great until text height is greater than then textarea height, and the textarea scrolls then the buttons scroll up until they eventually disappear.