bootstrap的问题之垂直居中。

（这是第一个博客，写的仓促）

最近写一个页面获取后台数据写到表格的时候，发现动态插入（insertRow，insertCell）表格时，排版变得很丑，文字与按钮在不同的表格中插入，明显看出不在同一水平线。纠结了很长时间。不管试着在css中添加（水平居中）text-align: center，还是添加（垂直居中）vertical-align: middle，都没有效果。浪费了挺多时间。

后来自己索性把bootstrap设置表格的class去掉，重新设置，才有效果。

然而，还是有一个问题，比如：

 str = "<div id='pp' ><p style='background-color: red;color:white;'>离线</p><div>"
 onlinec.innerHTML = str;

在动态插入的文字且设置样式后，还是会出现居中问题不对劲。

后来的解决办法是：对<p>标签设置css，如下：

 p{
    display: inline-block;
    margin-bottom: auto;
    vertical-align: middle;
   }

第一行是为了让背景颜色与文字紧凑表示，第二行让<p>标签距离表格单元格的底部距离自动。最终效果如下：

（如果看官有不同想法建议，欢迎评论指正！）