CSS | DIV 水平和竖直方向居中

1.竖直方向：

最近做个小页面遇到了点麻烦：需要设置元素的竖直方向居中。

以往的经验：

display: inline-block;
vertical-align: middle;

就可以解决。但是这次不行，很奇怪，不知道是高度变化的原因，还是用jquerymobile的问题，或者因为div嵌套在li 和 a 之间的问题。

解决办法：

table-cell 法：

<div id="wrapper">
	<div id="cell">
		<div class="content">
			Content goes here
		</div>
	</div>
</div>

CSS:

#wrapper {display:table;}
#cell {display:table-cell; vertical-align:middle;}

参考：

1. http://blog.themeforest.net/tutorials/vertical-centering-with-css/

2. http://blog.jobbole.com/46574/

2.水平方向：

常规做法：

<div id="parent">
	<div class="child">
	test
	</div>
</div>

CSS:

#parent{text-align:center;}
.child{margin:0 auto;}

即可。

不能水平居中的解决办法：http://blog.csdn.net/gxp_java/article/details/8675559