Modal pop up closing element X overlays other elements

Hi,

First question:
Trying to create a pop-up menu (similar to this with burger on the left).

1. Using modal popup button/icon.

2. When clicking on burger icon – a page comes up

3. The X icon (closing element) on the right top corner appears to be “above” (overlaid) all other elements that are inline with it (such as search form example). These elements (blocks) are not clickable, not working.

Second question:
Where the X icon (closing element) can be changed to another icon?

Thank you

Screenshot

Hi Calin,

Thank you, I missed those settings.

– Is it possible to place a Logo, Search form and Closing element X in the same line, like this?

Hi Calin,

Thank you for your response.

I do not think it is possible.

The ‘normal’ header is not an option since you cannot place a search form in it (or anything else).

The ‘above the content’ header does not work, because X is inside div ‘tdm-pm-header’. This div has z-index: 10, obviously to make the X work properly.

– As a result, whenever X visually seems to be on the same line as any other element (menu item, search form, logo with link etc), this element is not working, as it appears ‘below’ X element, so it is blocked.

Screenshot

You can see it here, and any other demo that has this type of menu.

– An option could probably be to set z-index 10 to any of those elements that are covered by X element?

The best would probably be, if you can please add on the list an option to have a ‘normal’ header, with logo and search form.

Thank you.

Hi Bettina,

No it’s not. It is just a narrow screen view of this demo.

Hi Bettina,

Please read the thread, because what you have said: “This is a default mobile modal, so it can not be customized with the TagDiv Composer” doesn’t seem to be relevant.

Hi,

You are saying information that is already known, obvious and irrelevant to the reported issue.