尽管边距/填充为0，但HTML在容器中仍然存在差距[重复]答案

【问题标题】：HTML still has gaps in container despite 0 margin/padding [duplicate]尽管边距/填充为0，但HTML在容器中仍然存在差距[重复]
【发布时间】：2022-01-01 08:39:30
【问题描述】：

所以我只有一行文本，背景颜色为红色。边距和内边距设置为 0。据我所知，没有孩子会造成咬合，但我的容器周围仍然有空隙。

我的 CSS

{
    width: auto;
    height: 100%;
    margin:0px;
    padding:0px; 
    

    background-color: rgb(207, 30, 30);
   
}

我的 HTML

<div class="main-container">
TEST
</div>

我的结果

请有人告诉我这么简单的事情我做错了什么

【问题讨论】：

标签： html css

【解决方案1】：

你包裹的整个元素是body？然后，您对其应用填充和边距 0。你可以用你的风格写：

body {
   margin: 0;
   padding: 0;
}

这将删除这个空间。

【讨论】：

【解决方案2】：

body 元素实际上是 has a default margin of 8px。所以将其设置为 0 应该可以解决问题。

body { margin: 0 }

【讨论】：

【解决方案3】：

浏览器往往有元素的默认设置——尤其是边距——所以根据你的浏览器，可能会有父元素的边距设置——如果没有其他可能是html和body这样的设置

{ 边距：0；填充：0； }

经常出现在样式表的顶部以删除这些默认值。

【讨论】：