可以使固定标头继承width属性

Question

我有一个具有固定标题行的表。当固定被禁用时，宽度会自动正确，但它不再固定，并将滚出容器div。一旦固定添加到属性，它会正确滚动但宽度不对齐。有了这个给定的场景，是否可以在保持使用“固定”属性的同时使宽度对齐？

    .container {
        border: 1px solid black;
        height: 100px;
        overflow-y: scroll;
    }
    td {
        font-size: 40px;
    }  
     table {
        table-layout: fixed;
        height: 100%;
    }
    thead{
        position:fixed;
    }

<div class="container">
    <table>
        <thead>
            <tr>
                <th>
                    header
                </th>
                <th>
                    header
                </th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>
                    data
                </td>
                <td>
                    data
                </td>
            </tr>
            <tr>
                <td>
                    data
                </td>
                <td>
                    data
                </td>
            </tr>
            <tr>
                <td>
                    data
                </td>
                <td>
                    data
                </td>
            </tr>
        </tbody>
    </table>
</div>

jsFiddle：https://jsfiddle.net/meeow314159/3vs9bmsf/2/

Answer 1

不，不可能。因为它不会为元素留出空间，因此它没有继承width

根据MDN

  

<强>固定

     

不要为元素留出空间。而是将其定位在相对于屏幕视口的指定位置，不要移动它   滚动时打印时，将其放在固定位置上   每一页。该值始终创建新的堆叠上下文。

有关固定定位的信息，请参阅specs