垂直方向文本（写作模式：lr-bt）。位置随文本长度而变化

Question

想要垂直定位动态文字，但文字长度会改变文字的位置，这里是代码段，添加更多文字更改位置尝试此 link

CSS

#rotate {
    position:fixed; 
    -webkit-transform:  rotate(270deg);
    -moz-transform:  rotate(270deg);
    -o-transform:  rotate(270deg);
    height:300px;
    background-color:#e1e1e1;
    margin-top:0px;
}

Answer 1

我认为你正在尝试做这样的事情。请注意，无需添加设置的高度/宽度，因为translate和transform-origin值会动态调整定位。

JSFiddle Demo

CSS

* {
    margin: 0;
    padding: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

#rotate {
    position:fixed;

    transform:  rotate(-90deg) translateX(-100%);
    transform-origin:left top;

    background-color:#e1e1e1;     
}