将旋转元素定位在页面右侧

Question

JSBin demo here.
如何将div旋转90度放在页面的右边缘，垂直居中？提前谢谢。

Answer 1

试试这个：

div {
    font-family: sans-serif;
    background: red;
    -webkit-transform: rotate(270deg);
    -webkit-transform-origin: bottom left;
    position: absolute;
    width:200px;
    height:20px;
    top:50%;
    margin-top:-20px; /* height */
    right:-200px; /* width */
} ​ ​​

Answer 2

    div{
vertical-align:middle;
    float:right;
    /* FF Chrome Opera etc */
    -webkit-transform: rotate(90deg); 
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    /* IE */
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
    }

检查this，可能会对您有所帮助。