Hallo,

Mit position: absolute nimmst du Elemente aus dem »normalen Fluss«. Damit verschieben sich nachfolgende nicht automatisch, stehen nicht darunter. Zwei Ideen:

1. Du positionierst beide Teile absolut, und der zweite Teil bekommt

top: 100%;

und fängt damit erst nach der Höhe des Viewports an.

http://codepen.io/molily/pen/jGKtC

2. Du verwendest die Einheit vh (Prozent der Viewport-Höhe). Das obige Element bekommt

height: 100vh;

Dann ist position: absolute nicht unbedingt nötig.

Die vh-Einheit unterstützen nur neuere Browser.

http://codepen.io/molily/pen/GzAxd

Vielleicht gibt’s noch einfachere Lösung, aber das fällt mir auf Anhieb ein.

Grüße
Mathias