Vaadin FormLayout formatting

Im new at vaadin 7 and have a little issue with formatting.

I have spend a few hours but no luck.

I have:

2 Form layouts on my vertical Layout.
2 Labels on each form layout.

Better check the screenshot

I want format label test as on the right part of screenshot. Can you please advice or share thoughts or ideas.

some code:

http://pastebin.com/T4nAjbeu

17619.png

You are going to need either CSS or use one GridLayout. The two form layouts don’t have any knowledge of eachother, so there is no way to align them programmatically. If you use a single gridlayout instead, everything is in the same layout, and the grid will align everything (you’ll need to create separate labels for your captions to put them in separate cells).

Using formlayouts and CSS, you’ll need to add a class name to your layouts, and override the CSS in your custom theme. You will most likely need to define the same width for both layouts, and separate cells, along with some alignment and paddings. The FormLayout is a Table under the hood, which should make changes relatively easy.