如何在jqgrid标题组中居中对齐文本

I am using the new header grouping feature of jqgrid 4.2 which works great except that it left aligns all of the text in the header groups.

我正在使用jqgrid 4.2的新标题分组功能，除了它左对齐标题组中的所有文本外，它的效果很好。

How can align the header group text to be center in the cell?

如何将标题组文本对齐到单元格的中心？

Here is a screenshot to show you how it seems to be working by default: (I want "Books" to be center aligned")

这是一个截图，向您展示默认情况下它是如何工作的:(我希望“书籍”中心对齐“）

NOTE: the regular column headers ARE center aligned.

注意：常规列标题中心对齐。

6 个解决方案

#1

Sorry, but I can't reproduce the problem. The demo produce the following grid with the center alignment column headers:

对不起，但我无法重现这个问题。该演示使用中心对齐列标题生成以下网格：

If you would post your demo one can examine where is the problem's origin. I suppose that some other CSS which you make the problem.

如果您要发布您的演示，可以检查问题的起源。我想其他一些你提出问题的CSS。

#2

The header group cell is given special class .ui-th-column-header. However this class has no special styling, if anywere in your project you have set text-align to left for th elements (for example in ASP.NET MVC the site.css is doing this) the text will not be center aligned. In most situations adding this to your CSS should do the trick:

标题组单元格被赋予特殊类.ui-th-column-header。但是这个类没有特殊的样式，如果你的项目中有任何东西你已经为左边的元素设置了text-align（例如在ASP.NET MVC中，site.css正在这样做）文本将不是居中对齐的。在大多数情况下，将此添加到您的CSS应该可以做到这一点：

.ui-th-column-header
{
  text-align: center;
}

#3

I had the same issue but i found the solution. you give titleText within the html center tag

我有同样的问题，但我找到了解决方案。你在html中心标签内给出了titleText

titleText: ' open center tag Books close center tag'

titleText：'开放中心标签书籍关闭中心标签'

#4

I had to center align text in table head columns in jqgrid, after element inspection, the following worked in my case:

我必须在jqgrid中的表头列中居中对齐文本，在元素检查之后，以下工作在我的情况下：

.ui-jqgrid-sortable {
    text-align: center;
}

Hope it helps someone.

希望它可以帮到某人。

#5

Try this,

尝试这个，

$('.ui-jqgrid .ui-jqgrid-htable .ui-th-div').css('text-align', 'center');

$（'。ui-jqgrid .ui-jqgrid-htable .ui-th-div'）。css（'text-align'，'center'）;

#6

Inspect the element then , get the id of the element

然后检查元素，获取元素的id

    $('#jqgh_grid-table_CountryName').css('text-align', 'left');