c# - Css 更改 asp tablecell，而不调整它的大小

Question

我在后面的代码中使用 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 样式更改表格单元格的大小后重新调整表格的大小？

Answer 1

您需要计算标签的新高度，然后将其包含元素设置为该高度。 This fiddle这就是我所说的。

<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));    
});

只需更改选择器以反射(reflect)您的需求。