固定表格单元格中垂直位置的位置：绝对

Question

需要创建具有固定列的表。设置绝对位置时，带有“ text1”的单元格没有中心垂直对齐。如何纠正？

<style>
.th {
    position: absolute;
    left: 0; width: 300px;
}
.tbl{ margin-left: 305px;}
td{height:100px;width:200px; vertical-align: middle; text-align:center;}
</style>

<table class=tbl border=1 >
 <tr >
  <td class=th>text1</td>
  <td>text2</td>
  <td>text3</td>
  <td>text4</td>
 </tr>
 </table>

Answer 1

仅针对具有'text1'绝对位置的单元格进行设置并在内部div中再次显示：table-cell和vertical-align：middle

<style>
.th{position:absolute;border:none}
.th2 {
   height:100px;
    width:300px;
    background-color:green;
    display: table-cell;
    vertical-align:middle;
    left:-200px;
    position:relative;
}
.tbl{ margin-left: 305px;}
td{height:100px;width:200px;vertical-align:bottom; }
</style>

<table class=tbl border=3 >
 <tr >
  <td class=th> <div class=th2>text1</div></td>
  <td>text2</td>
  <td>text3</td>
  <td>text4</td>
 </tr>
 </table>