The header is misalignment in safari browser use “Header Grouping With Columns Fixed ”

[ProgramAlgo]

I am opening an issue for

vue-easytable

Issue Type

Bug

Issue Title

“Header Grouping With Columns Fixed ” The header is misalignment in safari browser “表头分组结合固定列” Safari中表头错位

library Version

v2.14.0

Vue Type

2.6.11

Browser Type

macOS 12.2.1 Safari Version 15.3 (17612.4.9.1.8)

System version

macOS 12.2.1 iOS 15.3.1

Reproduction url

https://happy-coding-clans.github.io/vue-easytable/#/zh/doc/table/header-grouping?anchor=biao-tou-fen-zu-jie-he-gu-ding-lie

Step to reproduce

Open the 2.14.3 version of the official website example of "Header Grouping Combined with Fixed Columns" in Safari. Scrolling up and down will cause the column misalignment problem with multiple rows in the header.

用Safari 打开 2.14.3 版本的 “表头分组结合固定列 ”官网示例，上下滚动行会出现表头中包含多行的列错位问题。

What is expected?

The header displayed correctly

What is actually happening?

[ProgramAlgo]

a temporary fix

the second line th "top" is different from Chrome

<style>
@media not all and (min-resolution:.001dpcm) {
  @supports (-webkit-appearance:none) {
    .ve-table .ve-table-container table.ve-table-content thead.ve-table-header.ve-table-fixed-header tr:first-child th,
    .ve-table .ve-table-container table.ve-table-content thead.ve-table-header.ve-table-fixed-header tr:first-child td {
      position: sticky;
      position: -webkit-sticky; /* Safari */
      top: 0;
      z-index: 2;
    }

    .ve-table .ve-table-container table.ve-table-content thead.ve-table-header.ve-table-fixed-header tr:not(:first-child) th,
    .ve-table .ve-table-container table.ve-table-content thead.ve-table-header.ve-table-fixed-header tr:not(:first-child) td {
      position: sticky;
      position: -webkit-sticky; /* Safari */
     /* fix top */
      top: 128px !important;
      z-index: 3;
    }
  }
}
</style>