CSS旋转后垂直和水平对齐文本

所以我正在使用CSS来旋转一些文本从水平到垂直(90度)，如下所示：

-webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
writing-mode: tb-rl;
filter: flipv fliph;

我的问题是这样将文本方式转移到容器div之外。有没有把它保留在容器内的技巧？有可以设置的锚点吗？什么是跨浏览器调整帖子的方式？

解决方法

你可以用几个CSS属性把它拉回来

#whatever {
    position: relative;
    top: -4px;
    right: -10px;
}

或者，您可以使用transform-origin属性：

transform: rotate(-90deg);
transform-origin:20% 40%;
-ms-transform: rotate(-90deg); /* IE 9 */
-ms-transform-origin:20% 40%; /* IE 9 */
-webkit-transform: rotate(-90deg); /* Safari and Chrome */
-webkit-transform-origin:20% 40%; /* Safari and Chrome */
-moz-transform: rotate(-90deg); /* Firefox */
-moz-transform-origin:20% 40%; /* Firefox */
-o-transform: rotate(-90deg); /* Opera */
-o-transform-origin:20% 40%; /* Opera */

原文地址：https://www.jb51.cc/css/219355.html