html - css vertical-alignment 应该在单元格位置是绝对的时候工作还是这是浏览器中的错误/差距

标签 html css html-table

我注意到当位置设置为绝对时,表格单元格垂直对齐不起作用。我做错了什么吗?

非工作 sample

    <table>
      <thead >
        <tr>
          <th rowspan="2" style="position:absolute; left:100px; height:200px; vertical-align:bottom; border:solid 1px #CCCCCC;">bottom alignament is not working</th>
          <th style="position:absolute; left:400px;border:solid 1px #CCCCCC;"> a</th>
        </tr>
        <tr >
          <th style="position:absolute; left:500px; border:solid 1px #CCCCCC;"> a</th>
        </tr>
      </thead>
    </table>

通常的方法很好用

工作样本

    <table style="border:solid 1px #CCCCCC">
      <thead>
        <tr>
          <th rowspan="2" style="vertical-align:bottom; border:solid 1px #CCCCCC">bottom alignament ok</th>
          <th > a</th>
        </tr>
        <tr>
          <th > a</th>
        </tr>
      </thead>
    </table>

最佳答案

Vertical align table-cell don't work with position absolute帖子看起来像这样?

例如,将 包裹在一些包装器元素中。使包装器绝对定位。

    <table>
      <thead >
        <tr>
          <span style="position:absolute;">
            <th rowspan="2" style="border:solid 1px #CCCCCC; left:100px; height:200px; vertical-align:bottom;">bottom alignament is not working</th>
          </span>
          <th style="position:absolute; left:400px;border:solid 1px #CCCCCC;"> a</th>
        </tr>
        <tr >
          <th style="position:absolute; left:500px; border:solid 1px #CCCCCC;"> a</th>
        </tr>
      </thead>
    </table>

关于html - css vertical-alignment 应该在单元格位置是绝对的时候工作还是这是浏览器中的错误/差距,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47294535/

相关文章:

javascript - HTML/Javascript 如何将一个按钮链接到另一个按钮?

html - 在没有高度的绝对定位 div 内垂直对齐?

php - 根据使用 session 选择的行获取数据

html - 溢出的 DIV :auto and a 100% wide table

asp.net - Javascript函数定位正确的元素

html - 嵌套列表中的 IE 7 错误 div 正在破坏布局

javascript - 为什么单选按钮点击事件的行为不同

jquery - 整个div的反射(reflect)

CSS 选择器问题

jquery - 在加载时替换表格标签文本