我有一个<div>，它的宽度设置为100%。当我将position:fixed添加到它时，宽度变为16px更大。为什么固定位置会改变元素的宽度？
我注意到在身体上，所有边都有边距，所以我猜想position:fixed在某种程度上忽略了包含它的身体标记的边距。
我看着MDN Reference，但无法找到解释发生了什么的任何事情。
有什么position:fixed更改为导致此行为的<div>？
实施例：http://jsfiddle.net/UpeXV/
body自动有一个边距8px。所以当你将你的元素的width设置为100%时，它就变成了身体的宽度，两边减去8px。
但是，当您给出元素position:fixed时，它不再是相对于主体而是相对于没有边距的视口进行设置的。所以width现在是视口的宽度，它是2 * 8px更宽 - 您观察到的16px。
这里的W3 documentation on the subject：
鉴于位置和元件的尺寸与位置是：绝对是相对于它的包含块的位置和与位置的元素的尺寸：固定总是相对于初始包含块。这通常是视口：浏览器窗口或纸张的页面框。
正是我怀疑，谢谢:) – 2013-05-08 13:58:46
这有助于我了解当CSS中的位置发生更改时，究竟发生了什么，感谢您的时间 – 2013-05-08 14:05:03
@ChrisB，很高兴为您提供帮助！ – ASGM 2013-05-08 14:54:40
它看起来当你的元素设置为position:fixed等，它需要在视口上，而不是它的父的宽度。
固定定位与绝对定位类似，只是元素的包含块是视口。
感谢您的意见。
这是固定元素的默认行为，因为固定元素不会将其自身的上下文定位到其最近的定位父级，而是视口，从而在窗口中得到修复。正如您自己指出的那样，16px的宽度来自事实，身体的默认边距为8px。
如果需要固定的元素是100％的宽度，你还是要空间，您可以考虑使用box-sizing: border-box。然后使用填充而不是边距来创建空间。这将允许固定元素跨越页面的宽度而不会超过。除非使用border-box模型，边距和边框以及填充总是添加到元素的尺寸中，在这种情况下，宽度将包括填充和边框。
大胆猜测：你不再用'body'的填充处理所以'宽度：100％'很可能使用窗口宽度现在。 – 2013-05-08 13:50:21
听起来像预期的行为？它扩展到文档宽度的100％。 – 2013-05-08 13:50:25
@皮卡웃我并不是说这不是预期的行为，我只是想了解*为什么会发生这种情况 – 2013-05-08 13:51:11