如何在顶部显示引导警报

Question

我正在使用引导警报来显示成功和错误消息。我想将这些警报叠加在另一个div的顶部。 有几个SO帖子（here）我读了哪个建议使用postion:fixed但是这对我不起作用。在我的场景中需要发生两件事情。

1>所有警报需要位于另一个div的顶部。 （我想在我的情况的警报之下躲藏起来，因为在mt-form-panel类的背景颜色IM设置的。但是我们需要为内容的div某些背景色）

2>alert-success需要在的alert-danger

顶部

我有JSFiddle here

Answer 1

您可以使用z-index带来的警报到前面。

事情是这样的：

.mt-alerts { 
    position:fixed; 
    z-index: 999; 
} 

Answer 2

使用z-index:1000得到.mt-alerts出现在的.mt-form-panel顶部。

对于第2点，你可以做两件事。 A）从外观上看，似乎只有一次警报会一次显示出来，但都不能一起显示。在这种情况下，您可以将两个警报中的display:none;设置为默认值，并在各自的代码条件满足时将其设置回display:block。 B）您可以使用position:absolute以及边距和特定宽度将警报定位在同一位置。