Angular - Why does the # sign at z-index always appear?

Viewed 157

I don't know what is wrong with my code but I have set a z-index in my css like this:

.mat-mini-fab {
   position: absolute;
   right: 5px;
   top: 4px;
   z-index: 999;
   box-shadow: none !important;
}

But whenever I go to my site, the z-index is not applied and when I check in the developer console, there is always a # in front of the value so like this z-index: #999. I don't know where this comes from??

Tested in Chrome and Firefox. I am definitely sure in the code I never set the # before.

When I change this to 1000, there is no #, but below 1000 the # always is there... what kind of bug is this??

enter image description here

1 Answers

I got this problem after switching to Angular 12. Looks like a problem with the way Webpack bundles. I added the top limit of the z-index, then it did not add the #.

  z-index: 2147483647;
Related