css - 垂直文本不旋转 extjs

Question

我想制作一个垂直标题。使用 headerPosition:'left' extjs 自动旋转我的标题，但我想要的是产生一个像这样的标题真正垂直模式：

F

我

大号

吨

乙

R

那可能吗？

谢谢任何人

Answer 1

有可能的。旋转是由 CSStransform设置疯狂的，因此 CSS 也可以禁用它。示例 CSS：

#panel .x-panel-header-default-vertical .x-panel-header-text-container {
    -webkit-transform: none !important;
    -moz-transform: none;
    -o-transform: none;
    transform: none;
    overflow: visible;
}

#panel .x-panel-header-default-vertical .x-panel-header-text-container .x-header-text {
    word-wrap: break-word;
    word-break: break-all;
    white-space: pre;

    width: 10px;
    height: 16px;
    display: block;
    overflow: visible;
}

这可行，并且标题看起来像您期望的那样，由于某些布局定位，它是不可见的。我通过更改侦听器中标题元素的内联样式来四处走动：

listeners: {
    afterLayout: function() {
        this.header.titleCmp.el.setStyle('left', '0');
    }
}

工作样本：http: //jsfiddle.net/28q5N/1/