显示在模态窗口后面的Bootstrap工具提示

Question

我有一个模态窗口,包括div:

<div class="input-group">
    <div class="input-group-addon" title="Insert here your domain account name" data-toggle="tooltip" data-placement="left" id="Account">
        @Html.Label("Domain account name", new { @class = "control-label" })
    </div>
    <div class="a">
        @Html.TextBoxFor(model => model.Login, new { @class = "form-control" })
        @Html.ValidationMessageFor(model => model.Login)
    </div>
</div>

如您所见,标签上有一个工具提示.

这是代码:

$('#Account').tooltip({ container: 'body' });

代码正在运行,但工具提示显示在模态后面.我试着z-index像这样设置工具提示:

.tooltip {
    z-index: 1151,!important;
}

要么

 #Account {
     z-index: 1151,!important;
 }

但他们都没有工作.

您能否建议我应该如何设置CSS以使此工具提示显示在模态之上？

Answer 1

尝试之前没有逗号!重要:

.tooltip{
  z-index: 1151 !important;
}