Left, center, and right align divs on bottom of same line?

By setting your container div to position:relative and the child divs to position:absolute you can absolute position the divs within the confines of the container This makes it easy, as you can use bottom:0px to align all vertically to the bottom of the container, and then use left/right styling to position along the horizontal axis I set up a working jsFiddle: jsfiddle.net/Damien_at_SF/KM7sQ/5 and the code follows: HTML: div id="container"> left center right.

By setting your container div to position:relative and the child divs to position:absolute you can absolute position the divs within the confines of the container. This makes it easy, as you can use bottom:0px to align all vertically to the bottom of the container, and then use left/right styling to position along the horizontal axis. I set up a working jsFiddle: jsfiddle.net/Damien_at_SF/KM7sQ/5/ and the code follows: HTML: left center right CSS: #container { position:relative; height:400px; width:100%; border:thick solid black; } #container div { background:grey; width:200px; } #left { position:absolute; left:0px; bottom:0px; } #center { position:absolute; left:50%; margin-left:-100px; bottom:0px; } #right { position:absolute; right:0px; bottom:0px; } Note: For the "center" div, the margin-left = 1/2 the width of the div :) Hope that helps :).

1, if only because you posted the "same idea" as me, but faster. – thirtydot Feb 16 at 0:28 hahahaha you beat me to it, I was just writing up almost the identical same comment :P – Damien-at-SF Feb 16 at 0:30.

My technique is similar to @Damien-at-SF: I tried to rigorously demonstrate all the requirements you asked for. Live Demo HTML: CSS: #container { position: relative; height: 400px; width: 80%; min-width: 400px; margin: 0 auto; background: #ccc } #left, #right, #mid { position: absolute; bottom: 0; } #left { left: 0; width: 80px; height: 200px; background: red } #right { right: 0; width: 120px; height: 170px; background: blue } #mid { left:50%; margin-left: -80px; width: 160px; height: 300px; background: #f39 }.

1 +1 because... well yeah, as I said in response to your comment :P – Damien-at-SF Feb 16 at 0:30 I'd accept them both if I could :) – jrdioko Feb 16 at 1:33.

Set position: relative on the containing div, set position: relative on your 3 divs, and set the bottom attribute of the 3 divs to 0: bottom: 0.

To make your center div elastic, you could do something like.

I cant really gove you an answer,but what I can give you is a way to a solution, that is you have to find the anglde that you relate to or peaks your interest. A good paper is one that people get drawn into because it reaches them ln some way.As for me WW11 to me, I think of the holocaust and the effect it had on the survivors, their families and those who stood by and did nothing until it was too late.