CSS Layoutproblem: Position der Divs

[Samuel]

Hallo,

Ich habe etwas gebastelt, was aus drei Divs besteht und aussieht, wie im ersten Bild:

Jedes der Divs hat einen eigenen bg, oben der Header mit den Ornamenten, Mitte ein Pixel hohe, wiederholte Linie und unten der Footer.

Das Problem: Das mittlere Div beinhaltet Text, der zu weit unten anfängt. Geplant ist eigentlich, dass dieses (mit einem größerem Padding nach links und rechts natürlich) weiter höher anfängt. So wie hier:


Das habe ich in HTML versucht, in dem ich den Text in ein inneres Div gepackt habe und margin-top auf einen negativen Wert gesetzt habe. Da taucht dann das Problem auf, dass der BG des unteren den header abschneidet:


Wenn ich jedoch zusätzlich noch position:absolute für das Text-Div nehme, so passt das oben, aber es hängt natürlich komplett raus, weil es aus der Layoutreihenfolge rausgenommen wurde:


Jemand noch eine Idee?

Danke

Edit: Sorry für Typos, bin in eile

[Nightflyer]

Mach es wie im dritten Bild und gib dem mittleren DIV den Rest des Hintergrundbildes als Hintergrund

[Samuel]

Hallo,

verstehe ich nicht ganz. Das mittlere Div hat bereits ja einen Hintergrund -> der BG, den man dort sieht

[webxvideo]

Gib doch dem body den Hintergrund für den oberen und mittleren Teil und nur dem Footer einen eigenen Hintergrund.

[pilzebub]

div1 und div2, position: relative und z-index. div2 mit top an der gewünschten
stelle positionieren... so würde ichs machen

[Samuel]

Hallo,
habs hinbekommen, Ich hab den Inhalt in den Header gepackt. Der hat nur oben das Bild und das Div darunter hat den Rahmen. So skaliert alles korrekt und ich kann über margins den Abstand des Contents von der Header-Grafik steuern.

Danke für die Ideen;