[headerStyle] is not working

[Pamuditha]

Hi I want to align the text to the center in a give header cell in kendo ui angular grid. when i use headerStyle as below,it does not working.

<kendo-grid-column [headerStyle]="{'text-align': 'center'}" field="Action" title="Action" [width]="180" class="k-text-center" [sticky]="true"  [columnMenu]="false">
  <ng-template kendoGridCellTemplate let-dataItem>
      <img *ngIf="!dataItem.EntryIssue" src="../../../../../assets/svg/vpo-toolbar-icons/Group%20651.svg" alt="avatar">
      <img *ngIf="dataItem.EntryIssue"  src="../../../../../assets/svg/vpo-toolbar-icons/Group 703.svg" alt="avatar">
  </ng-template>
</kendo-grid-column>

[Martin Bechev]

Hello Pamuditha,

Thank you for the provided feedback.

It looks like when setting the sticky option to true, the styles passed to the headerStyle option are overwritten. Indeed this is the first time such an issue was reported. That is why I logged it in our public GitHub issue tracker:

https://github.com/telerik/kendo-angular/issues/3548

Please subscribe to it, in order to be notified in a timely manner where there is any update.

As a workaround, the developer could still apply any custom styling to the desired sticky header through default with custom CSS styling, like the following example demonstrates:

https://stackblitz.com/edit/angular-y3ciqk-dpuzcw

Please accept our apologies for the caused inconvenience until the issue is resolved.

Regards,
Martin
Progress Telerik