2 Divs nebeneinander, variabele Höhe, mit einem Image fest am unteren Rand

[hande.berlin]

Hallo ins Forum,

Ich habe ein css - Problem und zwar:

Ich mochte 2 Divs nebeneinander floaten, mit immer gleicher Höhe für beide Boxen, egal wie viel Inhalt dort herein kommt.

In der einen Box habe ich ein Image, dass immer am bottom ausgerichtete sein soll und 35% Gesamtbreite einnehmen soll. Die andere Box bekommt na klar: 65%.

Wie bekomme ich das hin? Gefloatet hab ich's bekommen, aber mit der variablen Höhe und dem Ausrichten des images am unteren Rand schaff ich's nicht...

Help pls

Danke!

 

[Sailor]

Versuche es mal mit CSS Flexbox https://css-tricks.com/snippets/css/a-guide-to-flexbox/

 

[hande.berlin]

display: flex; funktioniert gut, wie bekomme ich das Bild aber fest positioniert an den unteren Rand?

 

[Sailor]

Was hast du bisher gemacht... wie sieht dein Code aus (HTML und CSS)?

 

[hande.berlin]

.wrapper1 {
    display: flex;
    background-color: #d9e2f1;
    border-radius: 3px;
}

#div_links1 {
    border-left: 5px solid #3f4f69;
    padding: 20px 20px 15px;
    line-height: 1.5;
    flex: 2;
}

#div_rechts1 {
    margin-top: auto;
    flex: 1;
}

Hat geklappt. "margin-top: auto;" positioniert das Bild nun immer am unteren Rand.

 

[Sailor]

Super... dann hast du das ja alleine hinbekommen .

 

[hande.berlin]

Ja, dankeschön!