CSS position fixed issue

[RRolfes]

If the modal is within a div that is styled position: fixed; (e.g. within a fixed nav bar), the input and Link elements on the page (not in the nav bar) become unreachable. This may be because height and width of the modal are set to 100% of the page, with no way to alter them. Thus, the react-awesome-modal cannot be placed inside of a div that has its position fixed to the page.

New to using this npm, so it may be user error!

[JulianSuringa]

i encounter this issue. any update for it :)

[Way-U-Need]

same issue any solution?

[RRolfes]

Not that I am aware of. It was awhile ago, but I think I built my own modal and removed the package.

[ghost]

This is probably way too late, but in case someone else needs this; we ended up wrapping the entire modal-component to conditionally render on the visibility prop. That way we didn't get the fixed div overshadowing the entire app. Like this:

{showModal ? (
        <Modal
          visible={showModal}
          closeModal={ ... }
          onConfirmClick={...}
        />
      ) : null}