Using Mudblazor,In Datagrid where My headers is fixed and first column is Sticky Left while horizontal scrolling Fixed Header first column header is not fixed and it also get affected in horizontal scroll.
production link: https://try.mudblazor.com/snippet/mYQeFYaNPNVnOpvJ
Intial: in my datagrid, my header is fixed and first column is sticky left.
My Issue: In my datagrid, while horizontal scrolling my first column is sticky left but my first column header is not fixed and getting scrolled in horizontal scrolling. I want my first column header to be fixed and unaffected by horizontal scrolling.
By using FixedHeader="true" it overrides the z-index value of all header cells. The z-index of the header is now 2, while the z-index of left-sticky is 1.
There are surely better solutions but if you use
<style>
.mud-table-sticky-header * .mud-table-root .mud-table-head * .mud-table-cell:first-child
{
z-index: 3;
}
</style>
you can set the first headers z-index to 3 and it works as expected.
I have taken the .mud-table-sticky-header * .mud-table-root .mud-table-head * .mud-table-cell:first-child
straight from the devtools web inspector.