vertical-align没生效的原因

目的：让文字在div中居中

<div class="test">
	<a href="">测试文字</a>
</div>

.test{
	width: 200px;
	height: 80px;
	background-color: #ffff00;
	color: #000000;
	text-align: center;
	vertical-align : middle;   
}

但是设置上vertical-align之后并没有生效，效果如下：

原因是vertical-align只对行内标签有效（div标签，不是里面的子标签）于是加上代码

                 display: table-cell;

得到了效果图

不能设display：inline-block属性的原因， 是inline-block只是将块级元素当成内联元素排列，但是并没有把它变换为内联元素。

 

附display属性值