旋转元素的相对宽度

Question

我有一个锚点（a），它有height: 40%和width: 20px。其子元素是我应用的范围transform: rotate(90deg)和transform-origin: left bottom。

我希望跨度的尺寸与父代相同，因此我指定width: 100%。但是，旋转时，跨度会丢失这些尺寸。我可以用硬编码的像素值指定文本宽度，但我希望这个跨度相对于可用的屏幕大小是灵活的。

Fiddle demonstrating this issue

我知道我可以设置使用JavaScript跨度的宽度，但我想避免这样做，如果可能的话。有谁知道只有CSS的解决方案吗？

Answer 1

现在定义white-space: nowrap;

.pulltab > a > span {white-space: nowrap;} 

Demo