Layout components in vertical layout

Dear Vaadin user/developers!

It looks like I have a trivial layouting problem, but I can’t find an easy solution for it.
I have created a navigation bar with image button + combo box + image button. The combobox s rendered a bit higher than the images (look the attachment). I have checked model and found out that the true combobox height is 24px, while style sets it to 32px perhaps that is why it is stick to the top.

What is the easiest way to look them nicely horizontally aligned?

HorizontalLayout navigationBar = new HorizontalLayout();

navigationBar.addComponent(previousPageButton);
navigationBar.addComponent(pageNavigatorComboBox);
navigationBar.addComponent(nextPageButton);

11554.png

The arrow icon buttons are 32px high, and all content inside layouts is by default top aligned.

Use layout.setComponentAlignment(component, Alignment.MIDDLE_LEFT); to align components to the middle.

Thank you so much. Worked as a charm.