CSS：变换旋转不适用于跨度内部SVG标记

Question

我已经使用Chartis.js创建了一个图表。我喜欢这个，因为它的响应速但水平标签看起来没有反应，我试图使X标签旋转90度，以便保留很多空间，但它不起作用。

请帮助我，你可以看到我的小提琴这里https://jsfiddle.net/740yajof/

Answer 1

我不知道为什么，但它工作得很好，当您移动图表制作的脚本和样式外部资源。不需要!important或供应商前缀-webkit-*。我刚刚添加了transform-origin: left以将旋转锚点向左移动（默认情况下它位于中间）。

.ct-label.ct-horizontal.ct-end { 
    transform:rotate(90deg); 
    transform-origin: 0; 
} 

工作例如：https://jsfiddle.net/LukaszWiktor/15zyq0q1/