tabcell居中

http://www.cnblogs.com/2050/p/3392803.html

不是表格的元素，我们可以通过display:table-cell 来把它模拟成一个表格单元格，这样就可以利用表格那很方便的居中特性了

.playtabcell {
    display:table-cell;    
    text-align:center; /* 使inline 子元素水平居中*/
    vertical-align:middle; /* 使inline和block 子元素垂直居中 */        
}

.mid{ /* block 子元素在其父元素里水平居中 */
    margin-left:auto;
    margin-right:auto;
}

<div class="playtabcell" style="border-style:dashed;width:600px;height:500px;">
    <div class="mid" style="border-style:solid;width:200px;height:200px;">112</div>
</div>

父元素设置    display:table-cell;    text-align:center;    vertical-align:middle;   

此时子元素如果inline就可以水平和垂直居中，

如果子元素是block，为子元素设置    margin-left:auto;    margin-right:auto;就可垂直居中

总结：父元素设置    display:table-cell;    text-align:center;    vertical-align:middle;  

子元素设置    margin-left:auto;    margin-right:auto;

如此，不论子元素是inline还是block都可水平和垂直居中。