[BUG] -

[Polis]

Describe the bug

I've built a Chrome extension that reads document.body and shows a summary using Notiflix.Report. I am using Notiflix.Report in JS such as this:

import { Report } from 'notiflix/build/notiflix-report-aio';
Report.success(
    "Summary",
    request.result,
    'Okay',
    {
      messageMaxLength: request.result.length,
      width: `${document.body.clientWidth * 0.3}px`,
    },
  );

I've noticed that when on certain websites (e.g. any page on howtogeek.com), Notiflix.Report somehow shows behind the page and at the bottom (and sometimes never shows at all), whereas it shows fine (centered with a dynamic width as set) on most other sites.

Screenshots

Shows fine:

Shows(?) wrong:

Have you see something like this before? Any ideas?

Desktop:

• OS: macOS.
• Browser: Chrome
• Version: 111.0.5563.64 (Official Build) (x86_64)

[Furkan]

Hello,

You can try to use the zindex property.

https://github.com/notiflix/Notiflix#notiflix-report-module-default-options

Thanks.

[Polis]

Thanks! Could zindex affect the vertical positioning somehow? It’s showing towards the bottom whereas centered for a bunch of other websites.

On Wed, 22 Mar 2023 at 5:18 PM, Furkan ***@***.***> wrote: Hello, You can try to use the zindex property. https://github.com/notiflix/Notiflix#notiflix-report-module-default-options Thanks. — Reply to this email directly, view it on GitHub <#68 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ADRKRBAFN7FEWTWEIUCVHADW5MJ53ANCNFSM6AAAAAAWD62R64> . You are receiving this because you authored the thread.Message ID: ***@***.***>

-- Sent from Gmail Mobile

[Furkan]

The report module is fixed-positioned(default) and will be at the centre of the page.

I don't know about your implementation and your implementation is not the responsibility of Notiflix.

Maybe the only suggestion is to be sure that Notiflix is imported to the content (popup-content-sw) part of your extension (which means the part of each and every webpage individually)

Thanks.