9mo ago

Help with z-index in hamburger menu and new Firefox Sidebar

Issue in Firefox beta
hi, I set a z-index in 2 elements but don't work and I can't solve it.
I have this code to move the hamburger menu to left top side:

    
:root:not([chromehidden~="toolbar"]) #PanelUI-button {
        position: fixed;
        display: flex;
        top: var(--windowed-top-padding, 0px);
        left: 0px !important;
        z-index: 3 !important;
    }

and I have this code to move higher the Firefox Sidebar:

    
:root:not([sizemode="fullscreen"]):has(sidebar-main:not([expanded])) {
        & #sidebar-main {           
                /* Bakground-color necessary for gradient line color */
            background-color: var(--lwt-frame) !important;
                /* Top-bottom margins */
            padding-top: var(--padding-top-left-sidebar) !important;
                /* Gradient line */
            margin-top: calc( -1px - var(--bookmarksbar-height-personal, 0px) - var(--toolbar-height-personal) -
                             var(--Space-before-gradient-line)) !important;
            border-inline-end: 1px solid red !important;
            z-index: 2 !important;
        }
    }

the problem is the hamburger menu stay behind the Sidebar, I wonder why the z-index don't work.