RadzenDataGrid列内容右对齐、标题居中设置异常问题

你遇到的问题是因为TextAlign="Radzen.TextAlign.Right"这个属性会同时作用于列的标题单元格（<th>）和内容单元格（<td>），它给<th>设置的对齐样式优先级比你HeaderTemplate里div的text-align: center更高，所以标题还是保持右对齐。

下面是两种可行的解决方法：

方法一：用CellStyle替代TextAlign设置内容对齐 #

放弃使用TextAlign属性，改用CellStyle单独控制内容单元格的对齐，这样标题单元格不会被影响，HeaderTemplate里的居中样式就能正常生效：

<RadzenDataGridColumn Property="BestD_Waarde"
                   TItem="WebOrderModelDetail"       
                   CellStyle="text-align: right;"
                   FormatString="{0:N2}"
                   Width="60px">
                   <HeaderTemplate>
                       <div style="text-align: center;">Totaal</div>
                   </HeaderTemplate>
</RadzenDataGridColumn>

方法二：用CSS类分别控制标题和内容 #

如果需要更灵活的样式管理，可以定义CSS类，分别给标题和内容单元格指定样式：

首先在样式文件中添加：

/* 控制内容单元格右对齐 */
.grid-content-right {
    text-align: right;
}

/* 控制标题单元格居中，!important确保覆盖默认样式 */
.grid-header-center {
    text-align: center !important;
}

然后在列中引用这两个类：

<RadzenDataGridColumn Property="BestD_Waarde"
                   TItem="WebOrderModelDetail"       
                   CellClass="grid-content-right"
                   HeaderClass="grid-header-center"
                   FormatString="{0:N2}"
                   Width="60px">
                   <HeaderTemplate>
                       Totaal
                   </HeaderTemplate>
</RadzenDataGridColumn>

这样就能实现内容右对齐、标题居中的效果了。

内容的提问来源于stack exchange，提问作者MarcG