Microsoft Edge中的邊框底部錯誤

在Microsoft Edge瀏覽器中，將鼠標懸停後，border-bottom設置底部元素的顏色。錯誤？看的jsfiddle： https://jsfiddle.net/Experimenter/65eLh89r/Microsoft Edge中的邊框底部錯誤

a{ 
 
    display: block; 
 
    background: blue; 
 
    padding: 10px 30px; 
 
    color: rgba(255, 255, 255, 0.5); 
 
    border-bottom: 1px solid gray; 
 
} 
 
a:hover{ 
 
    color: white; 
 
}

<ul> 
 
    <li><a href="#">1</a></li> 
 
    <li><a href="#">2</a></li> 
 
    <li><a href="#">3</a></li> 
 
    <li><a href="#">4</a></li> 
 
    <li><a href="#">5</a></li> 
 
    <li><a href="#">6</a></li> 
 
    <li><a href="#">7</a></li> 
 
    <li><a href="#">8</a></li> 
 
    <li><a href="#">9</a></li> 
 
    <li><a href="#">0</a></li> 
 
</ul>

來源

2015-08-31 Experimenter

我無法重現bug。你能否更清楚你所遇到的錯誤。這將有所幫助。 –

您應該在Windows 10，Microsoft Edge中轉載它。它只在那裏工作！因此，只需將鼠標懸停在ul的列表項上，您就會看到邊框有時會消失。有一個肯定的錯誤，它在幾臺機器上進行了測試。我將附上截圖。 http://screenpresso.com/=s5Qkb – Experimenter

我爲Edge團隊內部創建了一個問題，當我從擁有這一代碼的團隊收到回覆時會更新。 – Patrick

有相同的問題，並創建了一種黑客或解決方法這個錯誤。什麼工作對我來說是使用margin-bottom: -1px;和border-bottom: 2px solid gray;

所以提到的例子看起來像：

a{ 
    display: block; 
    background: blue; 
    padding: 10px 30px; 
    color: rgba(255, 255, 255, 0.5); 
    border-bottom: 2px solid gray; 
    margin-bottom: -1px; 
} 
a:hover{ 
    color: white; 
}

來源

2016-04-08 07:46:59 UM404

謝謝，將高度設置爲@rjgamer建議的作品，但如果不符合要求，請使用margin-bottom工作。 –

有同樣的問題。如果高度或寬度是動態的並且沒有圓形的像素大小，則會出現。作爲解決方案示例：將高度更改爲40像素（或其他內容）和懸停效果。

但是微軟應該儘快修復這個「designbug」...... May Edge很快，但渲染並不完美！

來源

2015-09-11 07:16:21 rjgamer

Microsoft Edge中的邊框底部錯誤

回答

相關問題