want to position dynamic text vertically but text length alters the position of text, here is code snippet, adding more text changes the position try on this 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;
}
I think you are trying to do something like this. Note there is no need to add a set height/width as the translate
and transform-origin
values will adjust the positioning dynamically.
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;
}