Steps to Reproduce

Run fiddle
http://zkfiddle.org/sample/3q60rbv/1-Menubar-menupopup-display-position-if-height-below-button
Click the "menu" button in navbar

Current Result

If the window height is too small to display the popup below the button, the popup will be displayed to the left of the button instead.
Every child menupopup (submenu opened from 1st popup) will also be displayed to the left.

Expected Result

If vertical space below the button is not available, popup should be displayed to the right.
Children popups should also open to the right untill the border of the viewport is reached.
If horizontal space is not enough to display to the right and vertical space is not enough to display below, popup should open to the left

Debug Info

Position calculated from menupopup._syncPos()
If the current popup would overlap the parent, or if any ancestor would overlap the parent, position is calculated to the left of current parent.
https://github.com/zkoss/zk/blob/master/zul/src/archive/web/js/zul/menu/Menupopup.js#L142

Root Cause

Workaround

<script><![CDATA[ 
	zk.afterLoad('zul.menu', function() {
		var xMenu = {};
		function _toggleClickableCSS(wgt, remove) {
			if (wgt.isListen('onClick')) {
				jq(wgt.$n())[remove ? 'removeClass' : 'addClass'](wgt.$s('hover'));
			}
		}
		zk.override(zul.menu.Menu.prototype, xMenu ,{
			_togglePopup: function () {
				// show the content handler
				if (!this.menupopup && this._contentHandler) {
					this._showContentHandler();
				} else {
					if (!this.menupopup.isOpen()) {
						if (this.isTopmost())
							_toggleClickableCSS(this);
						this.menupopup.open(null,null,'end_before');
					} else if (this.isTopmost())
						this.menupopup.close({sendOnOpen: true});
					else
						zk(this.menupopup.$n('a')).focus(); // force to get a focus
				}
			}
		});//zk.override
	});//zk.afterLoad
 	]]></script>