IE8邊界使用僞：在

好吧IE8大師（確實存在這樣的事情？）。我需要一些幫助來解決因使用:after僞選擇器而導致的問題。這非常簡單 - 只需在懸停後的span標記後添加邊框（下劃線）即可。不，簡單的解決方案不僅僅是使用文本修飾屬性，因爲span標記內的元素是圖像（以及其他一些原因）。IE8邊界使用僞：在

這裏的HTML：

<div class="cta"> 
    Hover over me 
</div>

而這裏的CSS：

.cta { position:relative; z-index:1; display:inline-block; } 
.cta:after { position:absolute; z-index:1; left:0px; right:0px; bottom:0px; content:''; border-bottom:1px solid transparent; } 
.cta:hover:after { border-color:rgba(0,136,204,.6); }

而對於那些你在幫助真正感興趣，並希望發揮與它周圍，這裏的fiddle。

爲什麼地球上這不適用於IE8？適用於所有其他瀏覽器。我甚至嘗試刪除所有懸停的廢話，但我仍然無法讓邊框出現。對於我在互聯網上遇到的一些事情，我也嘗試在.cta div中添加display:block和width:100%。沒有骰子。

任何想法？

來源

2014-01-29 SeeMeCode

在你的問題中提問並回答，哈哈。你有沒有嘗試使用十六進制值來渲染它？ – xtraorange

IE8和更低的不支持rgba，所以儘量使用添加一個rgb回退：DEMO

.cta:hover:after 
{ 
    border-bottom:1px solid rgb(0,136,204); 
    border-bottom:1px solid rgba(0,136,204,.6); 
}

來源：「爲什麼在地球上，不是在IE8工作」 http://css-tricks.com/rgba-browser-support/

來源

2014-01-29 20:01:00 brouxhaha

@Adrift，我不是說刪除'：hover'，而是添加一個額外的樣式來刪除透明度。 – brouxhaha

@Adrift：你說得對，我甚至沒有注意到。感謝您的支持。改變了我的答案 - 透明不會被懸停時的邊框顏色覆蓋？ – brouxhaha

所以這確實解決了我在小提琴（和以上）中的問題，但並未解決我正在處理的實際問題。除了'rgba'屬性之外，還必須是另一件事。總之，謝謝你！ IE8只需要去... – SeeMeCode

IE8邊界使用僞：在

回答

相關問題