Css 固定位置投掷我的标题中心，除非我设置标题宽度为100%，为什么？

假设我有一个标题：

header {
     background-color: $main-background-color;
     height: 86px;

            #headerContent {
               background-color: $main-background-color;
               height:86px;
               margin:0px auto 0px auto;
               width: $site-width;
            }
}

当用户登录时，标题设置更改为：

header {
    background-color: $main-background-color;
    position:fixed; 
    width:100%;
    height: 40px;

        #headerContent {
            position:relative;
            background-color: $main-background-color;
            width: $site-width;
            margin:0px auto 0px auto;
            height:40px;
                img {
                    margin-top:12px;
                }
        }

}

我想知道的是，如果收割台宽度设置为“自动”，为什么我所有的定心都会出错？我只能用%。这是使用浏览器来确定什么是100%吗？当我使用auto时，页眉似乎消失了，我只能看到我的headercontent div，然后将其移到页面的左侧

我现在正在工作，但我只想了解发生了什么

---

亲切问候

我相信问题来自于你头上的

位置：固定的
。当您修复元素时，它们将脱离正常的页面流，容器将塌陷到其内容的大小。要进行测试，如果删除
位置：固定
声明，您应该会看到不需要将宽度设置为100%。
位置
固定
和
绝对
是默认的获取内容
宽度
和
高度
。这就是为什么当您定义
auto
时，它的内容
width
。最好定义
左
和
右
，而不是
宽度：100%
。像这样：

header{
 right:0;
 left:0;
 position:fixed;
}

工作原理与%。。谢谢那么这个脑袋的孩子也会被自动修复？这就是为什么我滚动时头部内容保持不变的原因吗？