Zurb Foundation Tooltip背景不透明问题

我使用Foundation 6和工具提示功能。Zurb Foundation Tooltip背景不透明问题

我试着添加z-index：9999;和不透明度：1到我的工具提示类，但没有任何影响。

 <ul class="icons"> 
      <li > 
      <a href="#" class="size thumbnail">XS</a> 
      </li> 
      <li data-tooltip aria-haspopup="true" class="has-tip top" data-disable-hover="t" title="Nicht verfügbar"> 
      <a href="#" class="size-not thumbnail">S</a> 
      </li> 
      <li data-tooltip aria-haspopup="true" class="has-tip top" data-disable-hover="false" title="Nicht verfügbar"> 
      <a href="#" class="size-not thumbnail">M</a> 
      </li> 
      <li class="selected"> 
      <a href="#" class="size thumbnail">L</a> 
      </li> 
      <li > 
      <a href="#" class="size thumbnail">XL</a> 
      </li> 
     </ul>

和属于CSS：

.has-tip { 
    border-bottom: 0; 
    z-index: 9999; 
    opacity: 1; 
}

一切正常，因为它应该除了背景文字是在提示可见。

我怎么能强制提示背景覆盖的背景文字？

来源

2016-03-17 StandardNerd

你试过了！对css规则很重要吗？ .has-tip { border-bottom：0; z-index：9999！重要; 不透明度：1; } – Alegrowin

是的，但它没有任何影响... – StandardNerd

我试图重现这里的问题..https：//jsfiddle.net/4gLb8djb/ 工具提示是其他东西..你可以更新这个小提琴我可以帮助你更多！ – Alegrowin

我已经更新的jsfiddle https://jsfiddle.net/4gLb8djb/8/

只是删除has.tip元素

.has-tip { 
    border-bottom: 0; 
    opacity: 1; 
} 
.tooltip { 
    z-index: 10000; 
}

上的z-index如果它不工作，也许有一个与不透明的问题： http://philipwalton.com/articles/what-no-one-told-you-about-z-index/

来源

2016-03-17 15:57:40 Alegrowin

再次感谢Algrowin为您付出的努力。去除z-index没有任何影响。您可以查看https://fadendaten.herokuapp.com/looks，查看我的工具提示问题。 – StandardNerd

.tooltip z-index：10000; } 目前它是10 – Alegrowin

真棒，谢谢Alegrowin！ – StandardNerd

Zurb Foundation Tooltip背景不透明问题

回答

相关问题