Footer sauber anpassen

[Dustin84]

Hallo,

ich suche eine Lösung einen sauberen Übergnag zwischen meinen Content DIV zum Footer DIV zu schaffen.

Um dieses Design gehts

Wie man sieht, ist es kein sauberer Übergnag zwischen Content und Footer.

Die Footergrafik hat eine feste Größe, die Contentgrafik hingegen wird wiederholt, um sich halt an die größe des Inhaltes anzupassen.

Dazu mal die Stylesheets:

/*********** INHALT CONTENT **********/
#contentcontainer {
width:950px;
height:100%;
}

.contentrepeat {
background-image:url(../bilder/contentrepeat.gif);
background-repeat:repeat-y;
margin-left:7px;
}

/*********** FOOTERS **********/
#footercontainer {
width:950px;
}

.footer {
background-image:url(../bilder/footer.gif);
background-repeat:no-repeat;
width:946px;
height:98px;
margin: 0px 0px 25px 0px;
}

Ich frage mich nun, wie ich einen sauberen Übergang bekome !

Gruß
D.

 

[Maik]

Hi,

hier liegt kein CSS-Problem vor bzw. das Darstellungsproblem lässt sich nicht mit CSS lösen.

Vielmehr steht hier die Frage im Raum, wie die Grafik in zwei harmonierende Teile "aufgeteilt" wird, weshalb ich den Thread für's Erste in das Forum für "Sonstige Grafikprogramme" verschiebe, da ich nicht weiß, welche Anwendung Du nutzt.

mfg Maik

 

[Dustin84]

Die Contentgrafik und Footergrafik sind aufeinander abgestimmt. Das Problem ist, dass die Contentgrafik sich pixelgenu dem Inhalt anpasst. Das ganze Problem könnte ich lösen, wenn ich der Contentgrafik irgendwie sagen könnte, dass sie sich immer in Originalgröße nach unten wiederholt.

 

[Maik]

Die anvisierte Nahtstelle der beiden Grafiken ist auf den Höhenpunkt "141px" in der Contentgrafik bei gleichzeitiger Verschiebung des umgebenden DIV-Blocks .contentrepeat nach rechts um "7px" aufeinander abgestimmt, denn die Breite der drei involvierten Grafikdateien ist nicht identisch (sie variiert bei 950px, 935px und 945px - v.o.n.u), was du im Stylesheet mit margin-left:7px für .contentrepeat und einer geringeren Breite für .footer auszugleichen versuchst.

CSS bietet keine Möglichkeit, ein "überdimensioniertes" Hintergrundbild in seiner vollständigen Bildhöhe zu wiederholen, wenn der Elementinhalt eine neue Zeile im Textfluß erzeugt.

An deiner Stelle würde ich es mit einer deutlich niedrigeren Grafik für den Contentbereich umsetzen, die die Zeilenhöhe des Textes unterschreitet, und darin das "grobe" Texturmuster in ein feineres umwandeln.

Oder findest du, dass sich die "Stöße" der Bildwiederholung von "contentrepeat.gif" sauber anpassen?

mfg Maik