带旋转词语的CSS垂直标签

Question

我期待构建垂直标签。

我遇到了一些问题，因为当我旋转它-90度时，div的END实际上是朝上的。因此，如果我使用绝对定位，“顶部”不再适用，因为我不知道div的宽度（它变化）。

那里有工具/插件允许我这样做吗？

检查http://imagebin.ca/view/4ov0ZF.html更多信息

Answer 1

做到这一点，最简单，最可靠的方法是使用图像。这样，如果JavaScript被禁用，它仍然会继续工作。实现应该也很简单（不需要旋转90度等）。所有选项卡可以位于其自己的列中，并且内容可以位于不同的列中。

Answer 2

嗯...有可能给你的标签固定尺寸？如果是这样，你可以做到这一点，没有图像，这是一个噩梦更新，并没有JavaScript（除了在IE中，这需要使用矩阵过滤器时的JS）。

这里的每一个浏览器的一个例子的解决方案：http://jsfiddle.net/SebastianPataneMasuelli/BjnaS/1/

Answer 3

如果你能建立一次你可以简单地把它们放入一个表的单个行，然后可以旋转的所有选项卡。

如果您一次全部旋转，那么跟踪前一个选项卡结束的位置就没有问题了。

我建议使用一个表格，因为我假设你想为标签使用边框，并且很难处理内嵌元素，否则为了让所有标签页在水平旋转一圈。