Question

我无法弄清楚为什么padding-top: 0px padding-top: 1px;移动<h1>元素超过1个像素。将其进一步增加，例如2像素，将具有预期的结果。

CSS

.pageholder {
    padding: 15px;
    padding-top: 0px;
    //padding-top: 1px;
    background-color: white;
}

HTML

<div id="content">
    <div class="pageholder">
            <h1>Add item link</h1>
    </div>
</div>

... aaand最后，问题的一个问题：http://jsfiddle.net/xbAqC/

（删除//以查看差异）

Answer 1

填充内部div会阻止margin collapse。当填充不存在时，<h1>的默认上边距会与<body>的边距折叠。填充可以防止这种情况。

您可以通过移除<body>的边距来查看差异：http://jsfiddle.net/xbAqC/2/

Answer 2

H1标签有自己的边距和填充。将h1的填充和边距设置为0，它可以解决您的问题。

Answer 3

您设置了填充顶部和填充。两者都不能共存。有两种方法可以解决它。一种是删除填充并为每一侧添加不同的填充，第二种（更好）填充是为每个边添加一个填充，但具有不同的值：

padding: 16px 15px 15px 15px;

在上面的例子中，第一个数字是顶部，第二个是右边，第三个底边和第四个左边。数字从顶部开始顺时针方向。

Answer 4

试试这个：LINK

.pageholder h1 {
    padding:15px ;
    padding-top: 1px;
    //padding-top: 1px;
    background-color: white;
}