可能使固定標題繼承寬度屬性

Question

我有一個具有固定標題行的表。當fixed被禁用時，寬度會自行正確地分配空間，但不再固定，並且將滾動出容器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圍繞固定定位