I have a div tag with a fixed height. Most of the images have the same height and width.
I want to align the images at the bottom of the div so that they are nicely arranged. Here is what I have so far:
<img src="1.png" alt=""/>
<img src="2.png" alt=""/>
<img src="3.png" alt=""/>
<img src="4.png" alt=""/>
<!-- navigation stuff -->
This is your code: http://jsfiddle.net/WSFnX/
display: table-cell is fine, provided that you're aware that it won't work in IE6/7. Other than that, it's safe: Is there a disadvantage of using `display:table-cell`on divs?
To fix the space at the bottom, add
vertical-align: bottom to the actual
Removing the space between the images boils down to this: bikeshedding CSS3 property alternative?
So, here's a demo with the whitespace removed in your HTML: http://jsfiddle.net/WSFnX/4/