Frame of HTML element covers other elements

Hello everybody,

I’m trying to implement a search bar on our site to search for entries in our custom database.

I started using elements from the editor (textinput + table as dropdown) but since I want to place the search bar in the header this approach didn’t work out.

Now I implemented a custom HTML element which works theoretically pretty good, but I still have one issue: I have to make the frame of the HTML element as big as its contents maximum size, but if I’m doing so all elements in this area can’t be clicked anymore, since they’re covered by the (hidden) search. I post some images to illustrate my problem a little better.


(‘Shops’ works fine but the ‘Über GreenL’ button can’t be clicked)

If I make the box of the HTML element smaller, the search dropdown gets cut off.

Is there a way to fix this? I tried so set pointer-events to none for the dropdown if it’s not displayed, but that doesn’t seem to fix it.

Greetings