.sign-ignore { z-index: sign(10%); } .sign-b { z-index: 1; } .sign-c { z-index: 0; } .sign-d { z-index: 0; } .sign-e { z-index: -1; } .sign-f { z-index: -0; } .abs-a { z-index: max((10%), -1 * (10%)); } .abs-b { z-index: 10px; } .abs-c { z-index: 0; } .abs-d { z-index: 0px; } .abs-e { z-index: 10px; } .abs-f { z-index: 0px; } .abs-g { --foo: 10px; z-index: max((var(--foo)), -1 * (var(--foo))); } .abs-h { --foo: 10px; z-index: max((var(--foo, max((-1%), -1 * (-1%)))), -1 * (var(--foo, max((-1%), -1 * (-1%))))); } .abs-i { z-index: max((10% + max((-1%), -1 * (-1%))), -1 * (10% + max((-1%), -1 * (-1%)))); } :root { --foo: 1; --bar: 10px; } .var-ignore-a { --foo: 10px; z-index: sign(var(--foo)); }