How can I send an inner to the bottom of its parent ?

Question

The div inside another div picture and code below. Because there will be text and images of the parent div. And red div will be the last element of the parent div.

<

Answer 1

Note : This is by no means the best possible way to do it!

Situation : I had to do the same thign only i was not able to add any extra divs, therefore i was stuck with what i had and rather than removing innerHTML and creating another via javascript almost like 2 renders i needed to have the content at the bottom (animated bar).

Solution: Given how tired I was at the time its seems normal to even think of such a method however I knew i had a parent DOM element which the bar's height was starting from.

Rather than messing with the javascript any further i used a (NOT ALWAYS GOOD IDEA) CSS answer! :)

-moz-transform:rotate(180deg);
-webkit-transform:rotate(180deg);
-ms-transform:rotate(180deg);

Yes thats correct, instead of positioning the DOM, i turned its parent upside down in css.

For my scenario it will work! Possibly for others too ! No Flame! :)

Answer 2

<div style="width: 200px; height: 150px; border: 1px solid black;position:relative">
    <div style="width: 100%; height: 50px; border: 1px solid red;position:absolute;bottom:0">
    </div>
</div>