Hi! I want to get that the items in a MenuBar closer to each other (as shown in the picture). How can I do that?.. Thanks.

Can’t you just style it with css?
As shown on the Styling page for MenuBar (https://vaadin.com/docs/latest/components/menu-bar/styling#items), the CSS selector for menu items is vaadin-menu-bar-item.
Their height is determined by two properties: padding and min-height. You could probably set min-height:0 and then tweak the padding to your liking.