Css 将gridview标题中的垂直文本与窄列对齐

环境：Microsoft Visual Studio 2019社区，使用VB.NET的ASP.NET v4.8 web应用程序项目

问题：我有一个包含文本和复选框列的gridview。我想使标题文本垂直（仅在复选框列中）以节省空间

这是通过以下方式实现的：

/* Vertical text for crowded table headings */
.verticalHeader {
    transform: rotate(-90deg);
    width: 120px;
    height: 20px;
    text-align: left;
    vertical-align: middle;
}

<asp:TemplateField
     HeaderText="Orgchart"
     SortExpression="Orgchart">
     <HeaderStyle CssClass="verticalHeader" />
     <ItemStyle  CssClass="narrowCol"/>
     <ItemTemplate>
        <asp:checkbox ID="cbOrgchart" runat="server" ></asp:checkbox>
     </ItemTemplate>
 <asp:TemplateField>

/*拥挤表格标题的垂直文本*/
.垂直收割台{
变换：旋转（-90度）；
宽度：120px；
高度：20px；
文本对齐：左对齐；
垂直对齐：中间对齐；
}

但是，垂直文本现在对于标题行来说太宽（即太高），并且会进入实际的复选框

这可以通过使用加深标题行来解决

<HeaderStyle-height="130px"/>

在gridview声明或任何templatefield声明中

问题是，应用此样式会使窄列标题达到130px高，旋转时标题宽度会变为130px，因此，在使用普通文本的列中，复选框上方会出现窄垂直文本

我尝试了各种方法将转换应用于文本，但没有成功

这必须是可以解决的，因为许多应用程序必须有相同的要求，但我被卡住了