2016-06-08 183 views
-2

這是一個非常短的簡單代碼的CodePenz-index跨瀏覽器不兼容性

only html and css, and Bootstrap 

它顯示了一個非常基本的Bootstrap旋轉木馬,並添加了一個白色透明覆蓋層。旋轉木馬標題應顯示在疊加層頂部,但不會像Chrome瀏覽器中那樣。不過,Firefox正在向它展示它應有的樣子。

我希望文本可以滑動並顯示在所有瀏覽器上仍然覆蓋的頂部。

+0

CodePen的鏈接很棒,但是您能否將相關的代碼放在問題中讓人們更好地幫助您? –

+0

@PraveenPuglia相關部分是標題的z索引。我希望他們出現在一切之上。他們不是,我只是想知道爲什麼。 – Perspectiive11

+1

歡迎來到堆棧溢出!尋求調試幫助的問題必須包括在問題本身中重現它的最短代碼**注意 - 請不要濫用代碼塊來解決此問題**。 –

回答

0

爲什麼不使用:

CSS

.carousel-inner > .item::before { 
    content: ''; 
    position: absolute; 
    top: 0; 
    left: 0; 
    right: 0; 
    bottom: 0; 
    background: white; 
    z-index: 1; 
    opacity: 0.5; 
} 

而是一個獨立的覆蓋容器? 我的意思是在你的CSS中有一個content: ''這個容器,所以我猜它是或者應該是一個僞元素。

+0

這解決了我的問題,非常感謝。^_ ^ – Perspectiive11