z-index在我的工具提示上不起作用

在我的site頂部的傳送帶上，我使用了兩種工具提示。首先是一個與轉盤至極使用實現了這個風格：z-index在我的工具提示上不起作用

#carousel div:hover span, 
     #carousel div.hover span { 
      background-color: #333; 
      color: #fff; 
      display: inline-block; 
      width: 500px; 
      padding: 2px 0; 
      margin: 0 0 0 -500px; 
      position: absolute; 
      bottom: 0; 
      left: 50%; 
      border-radius: 3px; 
      z-index: 600 !important; 
     }

這灰色的框，你可以與第一圖像看，如果越過包裝DIV，將削減它。即使我正在使用z-index。

第二個是一個至極使用類「tooltip4」：

.tooltip4:hover em { 
z-index: 600; 
text-align: center; 
font-style: normal; 
display: block; 
position: absolute; 
top: 50px; 
left: 50px; 
padding: 5px; 
color: #fff; 
/*border: 1px solid #bbb;*/ 
background-color:rgba(16,110,99,0.9); 
box-shadow: 0 0 7px 2px #1B8478; 
width:400px; 

}

這一個是使用第二圖像上，你甚至不能看到它，它應該有類似的效果在左邊的旋轉木馬。

請問有解決這些問題的方法嗎？

來源

2013-07-09 Exia0890

#carousel div:hover span,#carousel div.hover span {margin: 0 0 0 -90px;}

remove從這個類的z-index #carousel div

和編輯此類

.tooltip4:hover em {top: -243px;left: -197px;}

來源

2013-07-09 06:57:44

感謝您的回答，我現在確實可以看到第二個工具提示，但由於「overflow：hidden」，它仍然會在底部被切斷。如果可能的話，我希望它出現在標題之外。 – Exia0890

您可以使用位置：固定爲這個和偏離當然根據您的需要更改頂部和左側的值 –

非常感謝，它的工作原理。但它仍然被Firefox阻斷。 – Exia0890

我認爲問題實際上是你已將span放在div.caroufredsel_wrapper之內，它具有特定的寬度和高度，因此它在div以外被切斷。如果您將跨度放在較高的位置（如body或header或div#wrapper），它應該有效。

來源

2013-07-09 05:51:36 Dave

感謝您的回答，'div.caroufredsel_wrapper'寬度似乎是一樣的'包裝'一個。我看不到該工具提示的原因似乎是因爲溢出，但事件如果我使用CSS可見：我將能夠看到工具提示，但滑動時圖像也會溢出。我不知道如何將'span'放在更高的層次上，因爲它對於每個圖像都是如此（除非你正在談論z-index層次）。 – Exia0890

z-index在我的工具提示上不起作用

回答

相關問題