Bild am unteren Rand eines div-Containers festmachen

    Hallo,

    ich sitze seit einigen Stunden vor folgender Herausforderung.
    Ich habe eine Webseite, die in mehrere div-Container aufgeteilt ist. Einer für den Header, einer für eine linke Spalte im Hauptteil, einer für den mittigen Hauptteil, einer für den rechten Hauptteil und einen footer. Der gesamte Hauptteil (die 3 Bestandteile) sitzt ebenfalls in einem Container. Und um die gesamte Seite inkl. Header und footer ist auch nochmal einer drumrum.
    Soviel mal zum Gerüst.

    In der linken Spalte im Hauptteil soll am unteren Ende bündig ein Bild festgemacht werden. Leider habe ich keinen Schimmer, wie ich das da unten hin bekomme. Die für mich und mein Können einfachste Variante war das Einfügen einiger <br />, damit bekomme ich es definitiv nach unten. Da damit aber der linke Container "größer" wird, als der mittlere aber in der CSS der mittlere Container die Rahmen hat (was ich auch nicht ändern werde, da es mir sonst sämtliche Unterseiten zerhagelt), ergab es eine Rahmenlücke zum linken.

    Meine HTML und CSS-Kenntnisse sind leider nicht die besten. Ich mache hier mehr Learning-by-doing, aber auch über Selfhtml habe ich nicht die Lösung meines Problems gefunden.

    Kann mir dabei bitte mal jemand helfen? Danke im Voraus.

    Versuch mal folgenden einfachen Befehl ins Bild-html zu schreiben:

    align="absbottom"

    Bspl.:

    HTML
    <img src="images/blabla.jpg" alt="Name" width="WERT" height="WERT" align="absbottom">

    Falls nicht kannst du dir dann noch
    Absolute + Relative Positionierung oder
    das Boxmodel
    in CSS anschauen.

    Mit allen 3 Möglichkeiten ist es zu schaffen, wobei CSS für genaues ausrichten unentbehrlich ist.

    Versuch mal folgendes:

    Code
    div.links{position:relative;}
div.links img{display:block;width:100%;position:absolute;left:0;bottom:0;}

    Ich hab's zwar nicht getestet, sollte aber klappen...

    Stell dir vor es ist machbar, aber keiner kriegt's hin...

    CssApps.de

    Muss es ein Bild im Sinne eines <img>-Elementes sein, um es z.B. zu verlinken? Oder dient das Bild nur als Design-Element? Besonders bei letzterem würde ich dazu raten es als Hintergrundbild einzufügen. Die kann man dann auch nach unten positionieren.

    Code
    #links {
 background-image: url(bild.png);
 background-position: bottom right;
 background-repeat: no-repeat;
}

    Dachte nur das Boxmodel ist leichter zu verstehen als die Absolute/Relative Positionierung :cool:.