CSS is not working Blazor MudTable Inline edit

Question

Hi,

i have added a mudtable with inline edit and delete function.Problem is when i am clicking the second row for editing un edited row and header jumping to left side.How can i fix these CSS? please find my blazor app having this issue in below link.I need to make un editable row and header freez while inline edit is activated.

Issue is reproduced below link

https://try.mudblazor.com/snippet/cOwnkPvqeLirEMGT

Answer 1

Hi Raman,

Please replace your part of code

<ColGroup>
        @if (applyButtonPosition.DisplayApplyButtonAtStart() || (editButtonPosition.DisplayEditButtonAtStart() && editTrigger == TableEditTrigger.EditButton))
        {
            <col style="width:50px;" />
        }

        <col />
        <col />
        <col style="width:50%;" />


        @if (applyButtonPosition.DisplayApplyButtonAtEnd() || (editButtonPosition.DisplayEditButtonAtEnd() && editTrigger == TableEditTrigger.EditButton))
        {

            <col style="width:88px;" />
        }

    </ColGroup>

To

 <ColGroup>
        @if (applyButtonPosition.DisplayApplyButtonAtStart() || (editButtonPosition.DisplayEditButtonAtStart() && editTrigger == TableEditTrigger.EditButton))
        {
            <col style="width:50px;" />
        }
       
        <col style="width:0px;"/>
        <col style="width:0px;"/>
        <col style="width:50%;" />
       
       
        @if (applyButtonPosition.DisplayApplyButtonAtEnd() || (editButtonPosition.DisplayEditButtonAtEnd() && editTrigger == TableEditTrigger.EditButton))
        {
         
            <col style="width:88px;" />
        }

    </ColGroup>

Thanks

Naimish Makwana