I am trying to add the Google Custom Search Element to a web page. This is the code that I’m using:

<div class="gcse-searchbox-only" 
     data-resultsUrl="https://example.com/search-results/" 
     data-newWindow="false" 
     data-queryParameterName="q"
     id="search"></div>   

The widget itself works well, however the widget is placed below a div element containing other div elements that dynamically appear in order to present a drop-down menu. The drop-down menu appears behind the widget. How can I have the drop-down menu appear in front of the widget?

So far I’ve tried to address this by changing the z-index of the drop-down menu, and the z-index of the div element containing the widget, but it hasn’t had any effect.