twitter-bootstrap 显示在模态窗口后面的 Bootstrap 工具提示
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/22603255/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Bootstrap tooltip showing behind modal window
提问by szpic
I have a modal window which consists this div:
我有一个模态窗口，其中包括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>
As you can see, there is a tooltip on the label.
如您所见，标签上有一个工具提示。
It's initalized with this code:
它是用以下代码初始化的：
$('#Account').tooltip({ container: 'body' });
The code is working, but the tooltip is showing behind the modal. I tried setting the z-indexof the tooltip like this:
代码正在运行，但工具提示显示在模态后面。我尝试z-index像这样设置工具提示的：
.tooltip {
z-index: 1151,!important;
}
or
或者
#Account {
z-index: 1151,!important;
}
but none of them worked.
但他们都没有工作。
Can you suggest how should I set up CSS to make this tooltip show on top of the modal?
你能建议我应该如何设置 CSS 来使这个工具提示显示在模态之上吗？
采纳答案by Qwal
Try without comma before !important:
在 !important 之前尝试不使用逗号：
.tooltip{
z-index: 1151 !important;
}
回答by Kaushik Thanki
Just do one thing. Check the z-index of your modal popup & set the tooltip z-index +1 of your modal popup z-index.
只做一件事。检查模态弹出窗口的 z-index 并设置模态弹出窗口 z-index 的工具提示 z-index +1。
so it would be like
所以它会像
.tooltip{
z-index:( z-index of modal popup + 1 );
}
回答by JHOAN B. HENRICHE
this worked for me.
这对我有用。
.tooltip{
z-index: 1 !important;
}
