html - 模态警报

Question

我试图在模态窗口顶部显示此警报，但无法使其正常工作。相反，它显示在模态框后面。

html:

    <alert class="alertmessage" ng-repeat="alert in alerts" type="{{alert.type}}" close="closeAlert($index)">
            <small>{{alert.msg}}</small>
    </alert>

CSS:

    .alertmessage {
        position: fixed;
        top: 50%;
        left: 50%;
        width: 300px;
        margin-left: -150px;
        margin-top: -100px;
        text-align: center;
        z-index: 99999 !important;
        outline: 9999px solid rgba(0,0,0,0.8);
        border-radius: 0px;
    }

模态 css 是这样的:

    element.style {
        z-index: 1040;
        display: block;
    }

我错过了什么？我希望看到警报出现在模态框之上。

Answer 1

这是为您工作的更新版 Fiddle。 http://jsfiddle.net/benxmf5y/5/

我做的唯一改变是添加

z-index: 999999;