Thema: bild unten links am ende der seite positionieren

hallo zusammen,
ich arbeite mit dem template "lawncare" und möchte jetzt ein weiteres hintergrund-bild einfügen, dass immer am unteren rand der seite sein soll, also quasie im footer. der footer ist aber kleiner als das bild, deshalb passt es nicht darein. will auch nicht so nen nach oben gezogenen footer haben...
bisher habe ichs so probiert:

index.php
<p> class="bildeins"></p>

template.css
.bildeins {
background:url("../images/klein_kopf.png") no-repeat transparent;
bottom:0;
height:100%;
left:0;
margin-bottom:0;
margin-left:0;
position:absolute;
width:100%;

.bildeins {
background:url("../images/klein_kopf.png") no-repeat bottom left;
}

Ich habe es so gelöst:

Code:

img#MeineID {
position:fixed; bottom:0; right:20px;
z-index:-1;
}

Die Werte musst natürlich für dich anpassen und es ist kein Hintergrundbild, weil der Hintergrund bereits mit was anderem belegt ist. Du kannst keine zwei verschiedenden Hintergründe übereinander legen, falls du das beabsichtigst.

Das Bild selber steht entsprechend ganz einfach in der indes.php eingetragenen. Ohne DIV oder so etwas´:

Code:

<img id="MeineID" src="/bild.jpg" alt="Alternativer Text" />

EDIT: HansZ war schneller. Seine Lösung ist die bessere - sofern der Hintergrund noch nicht belegt ist



Axel

Zitat von time4mambo

Ich habe es so gelöst:

Code:

img#MeineID {
position:fixed; bottom:0; right:20px;
z-index:-1;
}

Die Werte musst natürlich für dich anpassen und es ist kein Hintergrundbild, weil der Hintergrund bereits mit was anderem belegt ist. Du kannst keine zwei verschiedenden Hintergründe übereinander legen, falls du das beabsichtigst.

Das Bild selber steht entsprechend ganz einfach in der indes.php eingetragenen. Ohne DIV oder so etwas´:

Code:

<img id="MeineID" src="/bild.jpg" alt="Alternativer Text" />

da kommt gar nichts, habe

Code:

<img id="MeineID" src="../images/klein_kopf.png" alt="Alternativer Text" />

direkt nachdem body tag eingefügt.

und wenn ich [CODE] background:url("../images/klein_kopf.png") no-repeat bottom left; [CODE] schreibe, passiert auch nichts.

eigentlich will ich zwei background-images eingbinden ^^ und ich weiß auch dass das nicht geht.

glaube aber das es irgendwie mit dem z-index gehen muss.

Es muss auch nicht
<p> class="bildeins"></p>
sondern
<p class="bildeins"></p>
heißen.

Ansonsten wär ein Link hilfreich.

Deine Pfade stimmen schon mal nicht.
Liegt die Grafik im "image-Verzeichnis" des Templates, dann lautet der Aufruf in der CSS-Datei:

Code:

"../images/MeinBild.jpg"

Wenn du dieses Verzeichnis aber in der index.php benutzen willst, musst du den Pfad anders schreiben:

PHP-Code:

src="<?php echo $this->baseurl; ?>/templates/<?php echo $this->template ?>/images/MeinBild.jpg"

Oder besser: du kopierst das Bild in den "/images/stories"-Ordner und kannst es dann in der index.php so ansprechen:

Code:

src=" images/stories/MeinBild.jpg"

(das Leerzeichen entfernen - URLs werden hier nur schwer dargestellt )
In "/images/stories" deswegen, weil du es dann auch noch zusätzlich in Beiträgen verwenden kannst. "/stories/" ist die erste Ebene auf die aus Verzeichnissen heraus zugegriffen werden kann.


Axel

@HansZ

Zitat von HansZ

Es muss auch nicht
<p> class="bildeins"></p>
sondern
<p class="bildeins"></p>
heißen.

sorry, hatte da ein ">" zuviel geschrieben, aber in meinem quellcode war alles richtig

Zitat von HansZ

Ansonsten wär ein Link hilfreich.

naja, ist aber noch im aufbau die seite, und ich porbier grade verschiedene plugins aus ^^
http://sonderlinge.pohlenski.de


@time4mambo
danke, die pfade habe ich jetzt auch angepasst, jetzt kommt dein bild, aber es ist fixed und unten rechts ^^

momentan sind eure beiden vorschläge umgesetzt, also bitte nicht wunder, wenn man auf die seite geht.

nochmal zum problem, ich möchte das bild gerne unten links am ende der seite haben, da wo der footer mit der anmeldung ist. das bild soll aber hinter den footer, quase auf die grüne wiese. wenns im footer ist, wird der zu sehr in die höhe gestreckt -.-

Schreibe <p class="bildeins"></p> über <div class="fleft" id="bottomcontent">

Zitat von HansZ

Schreibe <p class="bildeins"></p> über <div class="fleft" id="bottomcontent">

jetzt ist der immer am anfang der beiträge oben links -.-

Nein, bei mir ist er da wo er sein sollte, auch wenn das Template gerade geändert wurde...