How to fix dropdown and panel z-index issue?

Question

css

Hello!
There is a drop down menu which is in the first panel. When opened, it "climbs" under the second panel.

It's all to blame:

<div class="panel panel-default" style="opacity: 0.9;">

Each block is allegedly individually set opacity, so one goes under the other. Tried to remove opacity - everything became normal.
Adding an additional opacity class didn't help either. Adding opacity to the panel-default class didn't help either.
How can it be cured?

Answer 1

If you set a z-index and it doesn't work, then you haven't read the docs by z-index. try placing the one that runs over and the one that runs under position: relative;