单击一个按钮以显示模态，使该按钮出现在模态的“顶部”

Question

我有一个屏幕A和B。屏幕A包含我的角度应用程序内容div，其中包含一个按钮。屏幕B包含带有模式的背景。单击屏幕A中的按钮，使屏幕B可见。

我将Angular与* ngIf一起使用来显示/隐藏屏幕B。

问题在于，当屏幕B出现（背景和模式）时，在屏幕A中单击的按钮会出现在屏幕B的顶部（类似Z索引），直到其他内容被单击为止。我尝试将屏幕B的Z索引更改为较高的数字，但没有遇到麻烦。任何人熟悉这种行为？我将添加截图以说明我的问题。

屏幕B中的背景和模式是具有以下CSS的嵌套div：

from django.contrib.gis.utils.srs import add_srs_entry
from django.contrib.gdal import SpatialReference

srs = SpatialReference('''...PROJ.4 string...''')
add_srs_entry(srs)

Answer 1

z-index和位置固定道具一起存在一些问题。为此，您知道HTML中的堆栈。该元素是堆栈上下文。如果您有两个屏幕，则A和B表示（A和B是子级，而A不在B内），则给Z更高的索引，以便B看到它详情请参见z-index not working with fixed positioning