position:fixed状态下，div居中的问题？

Question

div{ width:600px; height:50px; position:fixed; top:0; margin:0 auto; }

想做个在窗口顶端固定居中的顶栏，这样写发现居中不了。

百度了一下，实现的方法是这样：

div{ width:600px; height:50px; position:fixed; margin:auto; top:0; left:0; right:0; }

求大牛解释一下原理。。

是因为margin:0 auto;的居中方式与position:fixed;冲突了吗？

top:0; left:0; right:0;这三个一起出现不是过分受限了吗？

为什么能实现水平居中的效果呢？

Answer 1

你不设置left，right，它还在原来的位置啊，它是脱离了文档流没错，它是相对浏览器定位的没错，但它跟原来的位置没变啊你设置了left:0; right:0;后，再配合margin: auto，这样浏览器就知道它应该放在哪个位置了，因为左边要0，右边也要是0，就只能居中了（纯属瞎扯淡）。