JQGrid - 子列宽小于标题列宽

Question

我遇到的问题是子列宽小于标题列宽度。因此，对齐看起来非常讨厌。我试过玩ui.jqgrid.css：

• .ui-jqgrid .ui-jqgrid-hdiv
• .ui-jqgrid .ui-jqgrid-hbox
• .ui-jqgrid .ui-jqgrid-htable .ui-jqgrid
• .ui-jqgrid-htable th

我也尝试了以下提到的解决方案：

• jqGrid column not aligned with column headers
• Jquery JQGrid - How to set alignment of grid header cells?

不幸的是，这些解决方案都不起作用。我正在使用 Jqgrid 4.5版本。

我目前使用的解决方法是使用以下方法删除标题的边框：

ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header

我附上截图以使其更清晰。有人遇到过这个问题吗？

Answer 1

谢谢@Oleg。但是没有任何其他的css是冲突的。问题是当您向数据表添加边框并且它推出1或2个像素时。显然，标题将保持在原始位置（数据列左侧1或2个像素）。因此，我们的想法是添加相同的边框并使填充为-2像素。

所以改变：

.ui-jqgrid .ui-jqgrid-htable th {height:22px;padding: 0 2px 0 -2px;}

然后添加左边框：

.ui-jqgrid .ui-jqgrid-htable {table-layout:fixed;margin:0;border-left: 1px solid #d3d3d3 !important;}

现在所有的路线都很好。

我仍然想知道为什么标题和数据是两个表。除非有充分的理由，否则我认为设计有点尴尬！也许奥列格可以回答。