使用CSS3转换将DIV翻转为侧面

Question

使用CSS3转换将DIV翻转为侧面

cssrotationcss-transformsrotatetransform

4

我有一个菜单，必须像下面所示一样旋转-90度出现在侧边。

enter image description here

注意：DIV具有动态宽度，因此我们无法旋转它，然后使用“top:-XX”将其向左或向上移动。

#rotateme {
    -webkit-transform: rotate(-90deg); 
    -webkit-transform-origin: 0 0; 
    position: absolute; 
    top: 250px; /*not going to work with dynamic width */
    left: 0px; 
}

我尝试使用CSS3转换和转换原点，但没有任何组合可以让我实现目标。

我在这里创建了一个fiddle（http://jsfiddle.net/P2UQy/8/），它会随机创建div的内容（动态宽度）。该fiddle还包括一个未成功使用CSS3转换进行旋转的尝试。

有人能否像上面的图片一样使它工作？如有需要，请随意添加更多容器/包装器。

- Mo Valipour

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- raymondralibi · Accepted Answer

我已经更新了你的fiddle。希望它能正常工作。