使用 HTML/CSS 删除边距的问题答案

【问题标题】：Issue removing margin with HTML/CSS使用 HTML/CSS 删除边距的问题
【发布时间】：2014-10-06 07:17:17
【问题描述】：

我似乎无法成功地用 div 完全填充水平空间。右、左、上、下总是有一点空间。

我目前正在使用：

CSS：

.section{
   width: 100%;
   display: inline-block;
   top: 0px;
   left: 0px;
   margin: 0px;
   padding: 0px;    
}
#section-1,#section-3{
   background-color: #ddd;    
}

HTML：

<div id="section-1" class="section">
  <p>Foo</p>
</div>

【问题讨论】：

这是浏览器的p 标记造成的。 jsfiddle.net/gpdeoL1v/6 使用浏览器重置 css 来进行更清洁的修复。

标签： html css margin

【解决方案1】：

还将margin: 0 放在body 上

body{
    margin: 0;
}

通常的做法是将html 和body 上的margin 和padding 都设置为0，以使其完美地跨浏览器工作。

html, body{
    padding: 0;
    margin: 0;
}

【讨论】：

【解决方案2】：

这实际上是因为 margin 对应于 body。请检查此fiddle。我已将此样式添加到 CSS：

body {
    margin: 0px;
}

【讨论】：

工作就像一个魅力！我想我误解了利润的作用。我认为它控制的是外边距而不是内边距。