Textbox in VerticalLayout flows over

Dear all
Currently I am using Vaadin 15 and I have the following setup: I need to put a TextArea into a VerticalLayout, but I don’t want a scrollbar to appear in the TextArea or in the inner layout, but only in the outer (main) layout. Currently the blue (main) layout and the yellow inner VerticalLayout only fill the visible part, while the TextArea is overflowing (see attached screenshots).
One problem is the minimum height of the TextArea: How can I get to adapt the Layouts to adapt to this size even if I shrink the window smaller than the minimum height? And the other problem is the scroll bar: With the VerticalLayout it appears by default in the TextArea. I tried some CSS options, but since I’m not very CSS savvy I did not find the solution.

Here’s the test code, I used to reproduce the problem:

@PostConstruct
	public void init() {
		this.setSizeFull();
		this.getStyle().set("background-color", "blue");
		VerticalLayout vl = new VerticalLayout();
		vl.setSizeFull();
		vl.getStyle().set("background-color", "yellow");
		TextArea ta = new TextArea();
		ta.setLabel("my textarea");
		ta.getStyle().set("minHeight", "250px");
		ta.getStyle().set("background-color", "white");
		ta.setWidthFull();
		ta.setClearButtonVisible(true);
		vl.add(ta);
		this.add(vl);
		}

Thanks for your help, any hints are appreciated!
18432620.jpg
18432623.jpg