CSS3旋转和起源

Question

我试图创造一些高端到文本将类似于此，

T 
E 
X 
T 

H 
E 
R 
E 

但是我的代码产生正确的效果，但不是严格正确说话，因为它是ouputting它像这样

E 
R 
E 
H 

T 
X 
E 
T 

这是我的CSS，我怎样才能让它成为第一个例子而不是第二个？

.accordion li > h2 { 
    color: black; 
    font-weight: normal; 
    margin: 0; 
    z-index: 2; 
    position: absolute; 
    top: 0; left: 0; 
    -webkit-transform: translateX(-100%) rotate(-90deg); 
    -webkit-transform-origin: right top; 
    -moz-transform: translateX(-100%) rotate(-90deg); 
    -moz-transform-origin: right top; 
    -o-transform: translateX(-100%) rotate(-90deg); 
    -o-transform-origin: right top; 
    -ms-transform: translateX(-100%) rotate(-90deg); 
    -ms-transform-origin: right top; 
    transform: translateX(-100%) rotate(-90deg); 
    transform-origin: right top; 
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); 
} 

Answer 1

要旋转90deg而不是-90deg。