0

我在后面的代码中使用 C# 制作了一个表格单元格，并在单元格内的标签中添加了一个 CSS 类来旋转它：

.vertical {color:#333;
                filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
                -webkit-transform:rotate(270deg);
                -moz-transform:rotate(270deg);
                -o-transform: rotate(270deg);
                white-space:nowrap;
                display:block;
                }

问题是在我旋转标签后，我的表格单元格（和表格）没有调整大小以适应新文本。有没有一种方法可以使用 CSS 或属性让我的表格自动调整大小以适应新内容？

我会很感激任何帮助。

--- 编辑--- 所以在玩了一些 CSS 类之后，我意识到了我的问题的根源。基本上，在我应用 CSS 更改后 - 我的表格不会调整大小。它们的大小仍然就像内容没有被修改一样。

CSS样式更改表格单元格的大小后，是否可以重新调整表格的大小？

4

1 回答 1

0

您需要计算height标签的新值，然后将其包含的元素设置为该高度。 这个小提琴就是我要说的。

<table>
    <tr>
        <td id="someLabel" class="vertical">some stuff</td>
        <td>some other stuff sljk fkas jd</td>
    </tr>    
    ...
</table>​

然后使用 jQuery

$.fn.textWidth = function () {
    var html_org = $(this).html();
    var html_calc = '<span>' + html_org + '</span>';
    $(this).html(html_calc);
    var width = $(this).find('span:first').width();
    $(this).html(html_org);
    return width;
};

$(function(){
    var someLabelSize = $("#someLabel").textWidth();
    $("#someLabel").css("height", (someLabelSize + 5));    
});

只需更改选择器以反映您的需求。

于 2012-10-04T20:26:55.093 回答