divの中で画像を下揃えに配置したい。

cssで左右中央揃えは、text-alignで簡単にできるが、

上下中央揃えは、なかなか難しい。

でも、簡単に設定できることが分かった。

http://www.yomotsu.net/wp/?p=387

言われてみれば、確かにそういう発想になるんだなと思った。

つまり、htmlのtableを使えば、簡単に設定できるので、

cssでdisplay:table-cell;とし、divをtableに見立ててしまおうというもの。

通常、何もしなければ、vertical-alignも効かないのだが、

divにdisplay:table-cell;を設定すれば、しっかりと効く。

ただし、ＩＥ6、7はdisplay:table-cell;は無視されるので、

* html div.sample1 div{/* IE 6 */
display:inline;
zoom:1;
}

*:first-child+html div.sample1 div{/* IE 7 */
display:inline;
zoom:1;
}

とすればよいらしい。