search

jpillora / notifyjs

Notify.js - A simple, versatile notification library
https://notifyjs.jpillora.com/
MIT License
1.91k stars 741 forks source link

How to override default z-index? #41

Open alianos- opened 9 years ago

alianos- commented 9 years ago

Hi,

I have an issue with notifications hiding behind other elements. I think is is caused because the z-index of the root is just 1, and as such the whole stacking context stays in the back (I am using open-layers and there are layers with 750).

.notifyjs-wrapper { z-index: 1; position: absolute; display: inline-block; height: 0; width: 0; }

What would be the best way to overcome this?

Thanks

jpillora commented 9 years ago

since notifyjs doesn't use element styles (the style attribute), you should be able to simply override that css rule (.myapp .notifyjs-wrapper)

On Tue, Aug 11, 2015 at 11:48 PM, alianos- notifications@github.com wrote:

Hi,

I have an issue with notifications hiding behind other elements. I think is is caused because the z-index of the root is just 1, and as such the whole stacking context stays in the back (I am using open-layers and there are layers with 750).

.notifyjs-wrapper { z-index: 1; position: absolute; display: inline-block; height: 0; width: 0; }

What would be the best way to overcome this?

Thanks

— Reply to this email directly or view it on GitHub https://github.com/jpillora/notifyjs/issues/41.

alianos- commented 9 years ago

Thanks. Not very neat but it does the trick. I actually used body .notifyjs-wrapper { } to work across the site. Very good library by the way!

EvanCarroll commented 8 years ago

When we pry out the CSS from the .js file and provide a default CSS. We'll add z-index:1 to our list of defaults. That will close out this issue.