Dropdown not overflowing

Hi,

I had this issue solved a long time ago, but it occured again after updating the theme. On my site www.farbratten-zucht.de the dropdowns on the menue are partially covered by the multicolored search bar below. We had that fixed by adding this css:
.e769-1.x-bar-scroll.x-bar-outer-spacers,
.e769-7.x-bar-scroll.x-bar-outer-spacers,
.hm1.x-bar-scroll.x-bar-outer-spacers,
.hm2.x-bar-scroll.x-bar-outer-spacers,
.hm3.x-bar-scroll.x-bar-outer-spacers,
.hm8.x-bar-scroll.x-bar-outer-spacers,
.hm9.x-bar-scroll.x-bar-outer-spacers,
.hm11.x-bar-scroll.x-bar-outer-spacers,
.hm13.x-bar-scroll.x-bar-outer-spacers {
overflow: inherit !important;
}

I updated the css with the recent numbers for the bars (it is kind of annoying that they change with every update) but it is not working anymore.

It would be great if somebody could help me soon, since I am really annoyed be this problem happening again and again after updating - it is alredy the third time!"

Best regards

Kathrin

Hi @kathringuttmann,

Thanks for reaching out.

The CSS has no relation to the issue since they are separated by two containers (two header bar). Fixing overflow is only applicable to the same container and the element is being clipped.

What you need to change is your header bar’s z-index.

Make sure the z-index of the header bar where the menu is greater than the z-index of the header bar where the search is.

Thanks!

Hi, thanks a lot, now it is working!

You’re welcome.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.