rotationX在IE 11中不起作用

Question

我的代码中具有以下结构-

<div>
    <table>
        <div className='table-head'>
            <thead>...</thead>
        </div>
        <div className='table-body'>
            <tbody>...</tbody>
        </div>
    </table>
</div>

.table-body {
    transform: rotateX(180deg); // works 
}

.table-body tbody {
    transform: rotateX(180deg); // does not work
}

我首先需要围绕tbody旋转包装器（文本显示为上下颠倒），以将滚动条从底部移动到顶部，然后我需要再次旋转tbody以正确显示文本（应该仅旋转文本而不滚动滚动条）。这在Chrome中有效，但在IE 11中，第二个rotateX无法正常工作。有人可以解释为什么吗？