Reply To: Header Builder – Mobile Menu – Show HTML Blocks

Hi

1. Mobile menu dropdown opener. This issue is not related to the patch 500743 or your previous custom code. It is caused by the combined width of your HTML-block content, which is wider than the mobile menu itself (the default mobile menu width is 300px). You can use the following custom code to limit mobile menu dropdown content to mobile menu width, but in that case, all overlapping content that is wider than 300px will be cropped.

.wd-nav-mobile.wd-html-block-on .menu-item-has-block>.wd-sub-menu {
	max-width: 300px;
}

To fix your issue properly you need to inspect your HTML-block content, reduce its overal size, paddings, margins, width, font size, disable “Row stretch” option, and wrap all columns in the rows one under another to ensure that the combined width of your HTML-block is not wider than the mobile menu itself.

2. Initial issue with empty space above and below the mobile menu HTML-block. You provided access to site https://wordpress-573315-3907141.cloudwaysapps.com/ where patch 500743 was applied (screenshot https://prnt.sc/PYa4XzcXAnZo) and problem with empty space created by empty <p> tags issue is already fixed (https://prnt.sc/Fl2CyJpJmq9Y).

In your first reply (https://xtemos.com/forums/topic/header-builder-mobile-menu-show-html-blocks/#post-498789) you provided the link to the site https://www.kbconsulting.be/, further, you capture the video on the following https://www.kbconsulting.be/ site in this reply (https://xtemos.com/forums/topic/header-builder-mobile-menu-show-html-blocks/#post-500951). As we mentioned, in our reply (https://xtemos.com/forums/topic/header-builder-mobile-menu-show-html-blocks/#post-501184) to fix your issue on your https://www.kbconsulting.be/ site we need to get access to the site where this video was captured.

Kind Regards