html - Div 不填充宽度为 :100% 的父级

Question

html

<main>
    <div class="homediv">
        <p>test</p>
    </div>
</main

CSS

div.homediv {
  background-color: yellow;
  width: 100%;
  position: static;
  /*The lower the z-index, the further in the background the element*/
  z-index: -1;
}

乍一看，这应该使 div 水平填充屏幕。但事实并非如此。这里的一些答案说 width:100% 仅在设置了父级的宽度时才有效，但那是已设置的。为了确保这一点，我什至为 html、body、main 和我的 div 提供了 width:100% 属性。这并没有解决它。

Answer 1

在 chrome DevTools 中尝试了一番之后，我发现 main 确实填满了屏幕宽度。但它包含一些我必须删除的看似预设的属性。谷歌告诉我填充和边距是 - 如果没有指定 - 由浏览器设置，所以要修复 css，我必须添加

main {
  padding:0;
  margin:0;
}