How can an element without a cascading context be larger than some elements z-index?

  node.js, question

The following code

<thead id="fixed_table_title" class="table-head">
 <tr>
 <th>Prescriber</th>
 </tr>
 </thead>
 
 
 <tbody id="fixed-body" class="table-body" style="transition: -webkit-transform 0s ease-out;   transform: translate3d(0px, -24.808px, 0px);"  >
 <tr>
 < td > merchandise 1</td >
 </tr>
 <tr>
 < td > merchandise 2</td >
 </tr>
 <tr>
 < td > merchandise 3</td >
 </tr>
 <tr>
 < td > merchandise 4</td >
 </tr>
 
 </tbody>
 
 
 
 #fixed_table_title{
 position: relative !  important;
 z-index: 10000 !  important;
 bracket
 #fixed-body{
 z-index: 100 !  important;
 position: relative !  important;
 bracket

An attempt was made to add a transform attribute or other attributes that caused the t-head to generate a cascading context. It was found that when the t-body transform axis attribute was changed, the t-head would still be overwritten by the T-body.

At the same level, it is determined by order and z-index value. At different levels, it is determined by the parent order and z-index.