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”属性的方式不同吗？

回答

相关问题