Html 副分区页边顶部

HTML

为什么子div的边缘相对于主体移动包裹，而不是相对于包裹本身移动包裹？（可能是有史以来最愚蠢的问题，但我不明白><）

---

欢迎来到利润率崩溃的奇妙世界：

基本上可以归结为： 如果有两个相邻的垂直边距，则只使用其中一个，而忽略另一个。浏览器假定您希望有一个1页边距，而不是您通常期望的：两个页边距彼此相加

实现所需的最简单（但不是那么优雅）的方法是将

wrap

diva

padding top

设置为

1px

，这样边距就不再相邻

.wrap {
    width: 100px;
    height: 100px;
    background: #565656;
}

.sub {
    background: red;
    margin-top: 100px;
}

---

Bazzz解释了原因，为了实现你想要的（据我所知）

---

这就是为什么我更喜欢尽可能多地使用填充物。我不确定避免这个问题是否是最好的解决方案，但肯定它是一个易于实现且触手可及的解决方案。我真的希望将来有一天，这一崩溃的保证金“特征”将被删除@SakerONE也许给予

包裹

一个

高度

为

99px

可以补偿

1px

填充顶部所产生的差异，这取决于您试图实现的目标。：）

.wrap {
    width: 100px;
    height: 100px;
    background: #565656;
}

.sub {
    background: red;
    margin-top: 100px;
}

.wrap {
 width: 100px;
 height: 100px;
 background: #565656;
 padding-top: 1px; /* add this */
}

.wrap {
    width: 100px;
    height: 100px;
    background: #565656;
  position:relative;
}

.sub {
    background: red;
    top: 100px;
  position:relative;
}