Firefox/IE處理css「right」屬性的方式不同嗎？

我有這樣一個div ...Firefox/IE處理css「right」屬性的方式不同嗎？

<div style="position:fixed; top: 60px; right: -51px;"> 
     <form> 
     .... 
     </form> 
    </div>

在鍍鉻/ Safari瀏覽器，在屏幕的右上方它完美地定位一個小搜索框。

在firefox/IE中，頂端是正確的，但是右邊的位置並不足夠緊貼邊緣（看起來像100px左右）。

下面是一個例子：http://codepen.io/d3wannabe/pen/LZNVqe

巨大的升值從誰知道爲什麼這可能發生的任何想法！

來源

2016-06-12 d3wannabe

我剛剛在Chrome，Edge，Firefox和IE11中查看了您的Codepen，並且搜索框被放置在我的筆記本電腦上所有人的相同位置 - 只是再次查看，也許這是幾個pxiel不同 – HenryM

嘿HenryM - 我只是將正確的位置改爲-70px。對我來說，這是一個非常明顯的差異 - 非常緊湊的鉻，並在Firefox上相當一段路。請讓我知道，如果你仍然沒有看到明顯的差異，我會上傳截圖（ps無論哪種方式，對差異原因的任何想法？） – d3wannabe

這不是關於right，但關於.search-container寬度 - 它是在鉻和Firefox不同，因此它看起來像.search-box具有跨瀏覽器不同的右間隙（火狐：http://i.imgur.com/OIh07eG.png）。您可以使用開發人員工具在不同的瀏覽器中檢查該工具。如果你想擁有相等的權利差距，你必須在position: fixed div內標準化內容寬度。

來源

2016-06-12 11:14:19 Andrey

謝謝安德烈 - 你是對的，例如，如果我在搜索容器上指定寬度：100px，它將錨定圖像。我現在需要弄清楚的唯一問題是如何在不破壞表單的情況下做到這一點（即當搜索容器的寬度爲100px時，請嘗試點擊它）。對此有任何進一步的想法？如果不是的話，我想我會接受這個問題作爲問題的答案，因爲它解決了關於正確定位的一般觀點 – d3wannabe

加width:0px;並更改爲right:0px似乎工作？

來源

2016-06-12 11:13:12 HenryM

對我來說只是打破形式（雖然我明白你的意思搜索圖標本身至少停留在右側 - 但其餘部分完全離開頁面） – d3wannabe

爲我工作！謝謝。 – xyres

Firefox/IE處理css「right」屬性的方式不同嗎？

回答

相關問題