HTML/CSS ist ja default-mässig flexibel, d.h. normalerweise passen sich die Elemente automatischen ihrem Inhalt an. Erst dardurch, dass du feste Größen angibst wird alles unflexibel. Dazu kommt auch noch das, da du alles (oder zumindest den Content) absolut positionierst. Absolut positionierte Elemente ignorieren alle andere Elemente und werden auch von den anderen ignoriert, dass heißt selbst wenn sich den Content-Element an die Größe seines Inhaltes anpassen würde, würde es alles was darauf folgt überdeckt.

Außerdem hast Du die Funktion von "clear" misverstanden. "Clear" bezieht sich nur auf Elemente, die zuvor mit "float" positioniert wurden, bei absolut positionierten Element hat es keine Auswirklung.

Mein Vorschlag wäre folgendes: Da du schreibst alle vier Bereiche sollen untereinander liegen, brauchst du keine absolute Positionierung. Block-Elemente wie DIV (die ich vermute, die du verwendest) werden automatisch hinterander positioniert. Gib am besten den Elementen keine feste Höhe (und am besten auch keine feste Breite) .

Die Fußleiste dagegen, soll ja unten plaziert werden, dafür kannst Du die absolute Positinierung benutzen. Mit "bottom: 0" bleibt sie unten. Damit es nicht vom Content überdeckt wird (oder umgekerrt), gibst du dem Content einem "margin-bottom" mit dem selben Wert wie die "height" des Fußes, den du in diesem Fall angibst, und zwar am besten im "em" und nicht "px"