css - Ngx-datatable 标题单元格文本未垂直对齐
问题描述
我在我的角度项目中使用 ngx-datatable。列是->“估计生产率”、“Wk1Rate”、“WK2Rate”、“WK3Rate”。
我使用 css 对文本应用了 Wrapping,以便在标题单元格中容纳文本 - “估计生产率”。因此,估计生产率显示为 3 行,而其他列名称显示为单行。headerheight 为“auto”,标题单元格的文本对齐为“center”
问题 - 文本 - “Wk1Rate”、“WK2Rate”、“WK3Rate” - 在标题单元格内没有垂直对齐。这些文本显示在顶部,如图所示:
如何使这些列垂直居中对齐。?我尝试了垂直对齐:中间,但没有工作。请帮忙。
ngx 数据表的 html 代码:
<ngx-datatable class="material" [rows]="MyRows" [headerHeight]="'auto'" [footerHeight]="40"
[rowHeight]="37" [limit]="10">
<ngx-datatable-column name="Est Production Rate" [sortable]="false"
[width]="85">
<ng-template ngx-datatable-cell-template let-value="value">
{{value}}
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column name="Wk1Rate" [width]="80">
<ng-template ngx-datatable-cell-template let-value="value">
{{value}}
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column name="Wk2Rate" [width]="80">
<ng-template ngx-datatable-cell-template let-value="value">
{{value}}
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column name="Wk3Rate" [width]="80">
<ng-template ngx-datatable-cell-template let-value="value">
{{value}}
</ng-template>
</ngx-datatable-column>
</ngx-datatable>
解决方案
在 globle 样式中尝试此操作。
.datatable-header-cell
{
display: flex !important;
align-items: center !important;
}
推荐阅读
- coq - 为什么这个 coq 程序不运行?
- javascript - 如何使用反应在网络聊天中向上/向下键
- kubernetes - Rancher:即使管理的集群为零,CPU 利用率也很高
- jmeter - JMeter 安装 - bin 文件夹中缺少 JMeter.bat 文件
- ubuntu - 如何对日期数据执行指数拟合?
- python - Python如何查找字符串的结尾4个字符或5个字符是否遵循模式
- android - 如何存储或处理来自 AndroidNetworking 响应/OkHttp 响应的响应
- reactjs - 打字稿:“未知”类型的对象
- node.js - MongoDB - 更新对象内对象数组中的数据
- python - reticulate 不会实时打印到控制台