Html 以100%宽度居中的固定位置Div

我发现了一些与此相关的问题，我尝试了多种方法来让它发挥作用，但我一直在寻找答案，所以我想我只需要发布我的细节。我有一个div，在其中我想用一个固定的位置将另一个div居中。我可以用我所附的CSS来实现这一点。但是，我看到的唯一问题是，如果我更改了主容器的宽度，那么我也必须更新标题div的宽度。我希望能够为标题div使用100%的宽度，以便它始终与父容器的宽度匹配，同时具有固定的位置并保持在div的中心

    #main-container{
    width: 800px;
    position: relative;
    margin: 0 auto;
    background-color:black;
    height: 100%;

}

#header{
  color: white;
  top: 20px;
  position: fixed;
  left: 50%;
  width: 1000px;
  margin-left:-500px;
  text-align: center;
  overflow:hidden;
}

对于#主容器，请尝试

 margin-left:auto;
 margin-right:auto;

---

固定位置相对于视口，而不是包含的元素。