body {position: relative;} ... dann knallt's woanders ;-)

[Gunnar Bittersmann]

@@Rolf B

Lösung:

body { 
   height: calc(100vh - 1em);
}

Minus ein emm wegen des Margins am Body. Sonst ist der Body zu hoch und es gibt rechts einen Scrollbar.

Das ist wohl eher ein Hack als eine Lösung.

Der Hack basiert darauf, das body { margin: 8px } im browserinternen Stylesheet steht und dass 1em 16px entspricht. Das kann gutgehen, muss aber nicht.

Sauberer ist da

body {
  margin: 0;
  min-height: 100vh;
}

und anderweitig dafür sorgen, dass der Inhalt nicht am Rand klebt.

😷 LLAP