自定义JeasyUI datagrid标头

Question

我正在尝试为我正在显示的某些信息获取特定的设计/布局，我正在使用Jeasyui，因为我喜欢一些功能，我可以用它和外观和感觉。

我正在尝试将输出作为下一张图像。

我在让桌子成为我想要的时候遇到了一些麻烦，为了文本的旋转，我在互联网上发现了一些确实帮助我获得它的代码，但这使得它非常难以理解更多的mods。我找到了这个css代码

.datagrid-header-row td[rowspan="1"] {
height:100px;
/* need to be properly fixed */
-webkit-transform: rotate(-90deg);
/* Safari */
-moz-transform: rotate(-90deg);
/* Firefox */
-ms-transform: rotate(-90deg);
/* IE */
-o-transform: rotate(-90deg);
/* Opera */
/* Internet Explorer */
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);

}

列宽太宽，我一直在使用不同宽度的css和HTML本身，我不能让它适合。在一些标题中，我需要自动换行，但它不起作用，必须使用<br/>但是一旦我得到所需的输出，这个标题就会动态加载。

这是我实际编码的链接。

My fiddle