#vertical align

[creativebrook]

How simple is that?!

[gpessia]

Messa subito alla prova. Pare regga benissimo! 

[zhusee2]

這招真的是神之對齊：在要垂直置中的 box 的上一層 container 放個 pseudo element (::before 或 ::after)，把高度設成跟 container 一樣高；接著把 pseudo element 跟要置中的 box 一起設 display: inline-block 跟 vertical-align: middle 就可以了！

[noteit-boblu]

Center image in div both horizontally and vertically

在写html的时候，经常会遇到需要把img放在div的中心的情况。这时，如果img的大小是固定的，那么还可以通过设置padding或者margin的方法实现，但是如果需要显示很多img，并且在图片大小不固定的情况下使之居中，就需要用另外的一种方式。

水平方向的居中： 水平方向的问题比较好解决，由于img是inline的属性，所以只要在外围的div中，加上text-align:center即可。

垂直方向的居中： 需要在外围的div中加入 display: table-cell; vertical-align: middle

参考

[mrwebpage]

This actually even works in IE... 7! IE7!