Isso pode ser devido ao recolhimento de margem e eu sei sobre o recolhimento de margem, pelo menos como isso afeta elementos adjacentes, mas eu não entendo como ele funciona em elementos aninhados quando as margens negativas estão envolvidas.

Por exemplo, nesta marcação e CSS acompanhante:

Marcação

<div class="parent">
  <div class="child">
    Child 1
  </div>
</div>

<div class="parent">
  <div class="child negative">
    Child 1
  </div>
</div>

CSS

body {
  background: white;
  padding: 45px;
}

.parent {
  border: 1px solid black;
  margin-bottom: 10px;
}

.negative {
  margin-bottom: -1px;
}

Exemplo ao vivoAqui.

Quando eu inspecionar a altura do segundo.parent div, noto que é 1 pixel a menos que o primeiro. Isso aconteceu por causa da margem negativa no.negative elemento dentro dele. Eu dei uma rápida olhada no W3C e não consegui encontrar uma explicação para esse comportamento.

Alguém poderia explicar o que está acontecendo aqui e também me fornecer um link para a seção de especificações do W3C?