Vertical layout element exceeding to other elements

Hi, I have a form with 5 inputs the problems is when I try to group some inputs they are not getting the vertical alignment correctly.
image.png
image.png

Did you try to use formlayout. You can customize responsitive steps

https://vaadin.com/docs/latest/components/form-layout

The problem is that you are using setWidth(100%) - this overwrites the form layout’s alignment magic.

Additionally, the usage of horizontal Layout is not needed if you configure the Form Layout to have 2 columns and make the first item 2 columns wide and the other 4 fields a single column wide. Then the form layout can do all the spacing and wrapping itself based on responsive steps