Steps to Reproduce

run the attached wrapped-menubar.zul
1. Open (Click) "Menu First Row 1"
2. Try move your mouse down in order to click Item 1 or 2

Actual Result

This will be quite difficult. In most cases the "Menu Second Row 1" will open before the user has the chance to click a menu item (you need to move the mouse very fast in order to stay in "Menu First Row 1")

Expected Result

(Improved) Usability

Debug Info

There is a visual gap (3px) between the <menu> and the <menupopup>
When moving the mouse over this gap the <menu> in the second row gets activated.

Root Cause

Workaround

the attachment contains a commented out CSS workaround using a an invisible ::after pseudo element to "close the gap" preventing mouse events from reaching the <menu> in the second row.

<style>
	.z-menu.z-menu-selected::after {
		background: transparent; /*invisible*/
		content: ' ';            /*invisible*/
		/*border: 1px solid red;*//*enable this line for visual feedback while debugging*/
		display: block;
		position: absolute;
		top: 100%;   /*exactly below the parent*/
		left: 0;     /*left aligned with the parent*/
		width: 100%; /*same width as parent*/
		height: 3px; /*cover the gap, tweak if you have a different spacing*/
		z-index: 21; /*just more than the menu z-index of 20, might have to be higher when used in a modal dialog*/
	}
</style>