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.

  • Godie@lemmy.worldOP
    link
    fedilink
    arrow-up
    1
    ·
    edit-2
    18 days ago

    ooooh, I wonder if I give a higher zindex to all the navigator-toolbox it could cause random problems but I will try.

    Edit: Sadly changing the z-index to all navigator-toolbox cause other issues in my theme and I should change a lot of code, hate this Firefox change jeje.

    Edit2: I tried this code and seems to work in some cases, I wonder what damage this could cause but the time will say:

    #navigator-toolbox{
            z-index: unset !important;
        }