在firefox中顯示爲兩條單獨的行的CSS大綱屬性

我正在使用CSS outline屬性創建一條虛線。雖然該行在Chrome和Safari中正確呈現，但在Firefox中，它顯示爲兩條單獨的行。如果我仔細調整窗口的大小，我可以將這兩條線完美對齊，使它們看起來像一條線，但我不應該這樣做。在firefox中顯示爲兩條單獨的行的CSS大綱屬性

瀏覽器CSS outline屬性：

CSS

.dash-border{ 
     outline-style: dashed; 
     outline-color: #fff; 
     width: 100%; 
     position:absolute; 
     bottom: 80px; 
}

HTML

<div class="dash-border"></div>

來源

2016-09-12 Spencer Pope

釷ey似乎在他們的文檔中遇到了同樣的問題：https：//developer.mozilla.org/fr/docs/Web/CSS/outline –

你能解釋一下你的意思嗎？它看起來像是兩條獨立的行嗎？我在Chrome和Mozila中都得到了相同的正常結果 – Chris

@Chris我添加了大綱如何在chrome中呈現的圖像，但圖像上傳功能有點奇怪，因此在firefox中呈現的示例是指這imgur鏈接，http://imgur.com/a/LU6K7 –

嘗試使用-moz，例如：

.dash-border 
{ 
    outline-style: dashed; 
    outline-color: #fff; 
    -moz-outline-style:dashed; 
    -moz-outline-color: #fff; 
    width: 100%; 
    position:absolute; 
    bottom: 80px; 
}

來源

2016-09-12 20:09:55 Alexrember

使用-moz前綴似乎不適用於這些屬性。當我檢查元素時，它將這些屬性的-moz值列爲無效。 –

在firefox中顯示爲兩條單獨的行的CSS大綱屬性

回答

相關問題