Footer mittig und mit Text auf halber Höhe

[t0day]

Moin Leute,
ich habe aktuell mal wieder angefangen mir eine kleine Seite zu basteln. Bis auf den footer funktioniert auch alles wie es soll.

Mein Footer besteht aus 3 Bildern und einem Text.
Das Bild "footer_left.gif" ist für die linke Seite des Footers. "footer_right.gif" dementsprechend für die rechte Seite. In den Zwischenraum kommt ein Text, dessen Hintergrund aus "footer_base.gif" besteht.
HTML:

<center>
<div class="footer"><img src="images/footer_left.gif" />
	
	<a href="zero.php">by [0] - z3r0 clan</a>
    <img src="images/footer_right.gif" />
	</div>
   </center>

CSS:

.footer {
	background-image:url(images/footer_base.gif);
}

Allerdings stellen sich mir jetzt zwei Probleme:
1) Der Text ist am Boden der Seite. Er sollte aber ca. in der Mitte des Footers sein.
2) footer_base wird über die komplette Seitenbreite gestreckt. Mittels position:absolute und left kann ich das zwar beheben, aber dann bewegt sich der footer ja mit.

Hat da jemand ne Idee für mich?

 

[dreifragezeichen]

Bei dem Markup (Grafik-links - Text-Link - Grafik-rechts) empfehle ich das Kapitel Grafik zum umgebenden Text ausrichten bzw. Grafiken ausrichten mit CSS.

 

[t0day]

Ersteinmal Danke. Das Problem Nr.1 konnte ich damit schonmal beheben.
Das 2. Problem besteht jedoch immernoch. Der footer wird einfach gestreckt. Mit passendem width wird er zwar nicht mehr gestreckt, aber jetzt "schwebt" der footer direkt unter dem Content.
Kleine Anmerkung hierzu noch: Der Footer soll sich nicht mitbewegen, sondern nur am Ende der Seite, wie zB hier im Forum.

 

[dreifragezeichen]

Das 2. Problem besteht jedoch immernoch. Der footer wird einfach gestreckt. Mit passendem width wird er zwar nicht mehr gestreckt, aber jetzt "schwebt" der footer direkt unter dem Content.

Was darf man sich denn unter dem Ausdruck "schweben" vorstellen?

Und wo, wenn nicht direkt unter dem Inhalt, aber doch am Ende der Seite?

.footer {
width:800px; /* Breite von mir frei gewählt */
margin:0 auto; /* sorgt für horizontale Zentrierung */
}

 

[dreifragezeichen]

Vielleicht stellst du dir das mit dem Footer am Seitenende ja so vor?

tutorials.de > Webmaster & Internet > Webmaster FAQ > CSS Wie lässt sich der Footer am unteren Fensterrand ausrichten?

 

[Strafi]

Floating und Display und vertical-align sollten das eigendlich schaffen. vertical kannste auch gegen padding tauschen.

ich würde den footer ein höhe geben und mitt padding den text formatieren.

 

[dreifragezeichen]

Floating und Display und vertical-align sollten das eigendlich schaffen. vertical kannste auch gegen padding tauschen.

ich würde den footer ein höhe geben und mitt padding den text formatieren.

Dein Vorschlag ist zwar vom Grundsatz her richtig, würde hier in diesem Fall aber nicht das vorgestellte Problem der vertikalen Ausrichtung des Textes gegenüber den Grafiken beheben.

Da scheinbar nicht das vollständige Thema gelesen:

Mein Footer besteht aus 3 Bildern und einem Text.
Das Bild "footer_left.gif" ist für die linke Seite des Footers. "footer_right.gif" dementsprechend für die rechte Seite. In den Zwischenraum kommt ein Text, dessen Hintergrund aus "footer_base.gif" besteht.

HTML:

<div class="footer"><img src="images/footer_left.gif" />
    
    <a href="zero.php">by [0] - z3r0 clan</a>
    <img src="images/footer_right.gif" />
    </div>

Allerdings stellen sich mir jetzt zwei Probleme:
1) Der Text ist am Boden der Seite. Er sollte aber ca. in der Mitte des Footers sein.

Bei dem Markup (Grafik-links - Text-Link - Grafik-rechts) empfehle ich das Kapitel Grafik zum umgebenden Text ausrichten bzw. Grafiken ausrichten mit CSS.

Ersteinmal Danke. Das Problem Nr.1 konnte ich damit schonmal beheben.

 

[Strafi]

Dein Vorschlag ist zwar vom Grundsatz her richtig, würde hier in diesem Fall aber nicht das vorgestellte Problem der vertikalen Ausrichtung des Textes gegenüber den Grafiken beheben.

Da scheinbar nicht das vollständige Thema gelesen:

Na doch. Ich kann so Text gegenüber einer Grafik ausrichten. Und ich denke schon das ich das Thema vollständig gelesen habe. Mal bisschen Etikette bewahren Freundchen.

hier sieht man das sehr schön: http://www.drweb.de/magazin/vertical-align-css/

und wenn ich als css nur das habe:

.footer {
background-image:url(images/footer_base.gif);
}

ja was soll ich da zu problem 2 sagen? Sind alle DIVs in einen Div der die Seite bestimmt****? Sorry, ich sehe nicht mal ein float, also denke ich das er aus dem Dokumentenfluss ist. usw...

 

[dreifragezeichen]

ich würde den footer ein höhe geben und mitt padding den text formatieren.

Ist hier definitiv nicht dienlich, den Text vertikal zur Grafik auszurichten, was hier das Problem ist bzw. bis zu meinem Lösungsvorschlag war.

Mal bisschen Etikette bewahren Freundchen.

Freundchen?

Sind wir uns in diesem Leben schon mal begegnet? Hab ich dir schon mal einen Glückskeks geschenkt?

Nicht dass ich wüßte.

 

[Strafi]

Mensch komm mal klar! Du solltest mal deine Art und Weise überdenken. Das bedeutet Etikette - Freundchen war Kynismós.

Wenn ich den Footer die gleiche Höhe der Grafik gebe und den Text einen padding wird das wohl gehen. Und man wird wohl davon ausgehen können das die Grafik(en) die alle gleiche Höhe besitzen. Und ich sehe auch nur ein statischen Text im Footer also was soll daran verkehrt sein das nicht mit einer Höhe und ein Padding zu machen?

man man man