JQGrid - 子列宽度小于标题列宽度

Question

我面临的问题是子列宽度小于标题列宽度。结果，对齐看起来很讨厌。我试着玩弄的ui.jqgrid.css：

• 的.ui-的jqGrid的.ui-的jqGrid-HDIV
• 的.ui-的jqGrid的.ui-的jqGrid - 横向盒
• 的.ui-的jqGrid的.ui-的jqGrid - htable的.ui-的jqGrid
• 的.ui-的jqGrid-htable个

我也尝试中提到的解决方案：

• 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;} 

现在所有的路线都很好。

我仍然想知道为什么标题和数据是两个表。除非有很强的理由，否则我相信这有点尴尬！也许Oleg可以回答。