css - 使用 CSS3 转换打开一个 DIV

Question

我有一个菜单，它必须出现在旋转 -90 度的一侧，如下图所示。

注意：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 转换和转换原点，但没有任何组合可以让我到达那里。

我在这里创建了一个小提琴（http://jsfiddle.net/P2UQy/8/），它随机创建了 div 的内容（动态宽度）。此小提琴还包括使用 CSS3 转换进行旋转的失败尝试。

任何人都可以让它像上图所示的那样工作吗？如果需要，请随意添加更多容器/包装器。

Answer 1

我已经更新了你的小提琴。希望它会工作。