我在容器中有一些 90 度旋转跨度,我想将容器的高度设置为最高旋转元素的高度。
第一步是获取最高元素的高度:
var $max_width = Math.max.apply(Math, $('.tbl-value').map(function(){
return $(this).width();
}).get());
来源:jQuery get max width of child div's
这个解决方案对我来说看起来是正确的,但似乎无法正常工作。下一步是将父容器的高度设置为 $max_width
大小。
这是我的 fiddle 代码:http://jsfiddle.net/m4z5701p/
我怎样才能做到这一点?
Ps.: 我知道我的 JS 代码很乱,很抱歉。
最佳答案
.rotated-text {
display: inline-block;
overflow: hidden;
width: 1.5em;
line-height: 1.5;
}
.rotated-text__inner {
display: inline-block;
white-space: nowrap;
transform: translate(0,100%) rotate(-90deg);
transform-origin: 0 0;
}
.rotated-text__inner:after {
content: "";
float: left;
margin-top: 100%;
}
<span class="rotated-text">
<span class="rotated-text__inner">
Rotated foo
</span>
</span>
旋转解决方案的最佳文章试试这个我可能对你有用 http://kizu.ru/en/fun/rotated-text/
关于javascript - 旋转文本容器自动高度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30524627/