获取TD单元格宽度以使用指定的宽度%环绕div

Question

这是我当前的HTML / CSS：http://jsfiddle.net/S8Bne/

这是一个截图，注解了我想要做的事情：

​

​

基本上，我希望父TD的宽度根据嵌套div的宽度动态换行。这个是可能的吗？

Answer 1

Well...as Sheepy指出，最初，你所问的似乎没有意义。但如果你真的想让TD与内部DIV一起调整，你将需要做一些JavaScript...

假设您有以下表格单元格：

<td rowspan="4" id="tdwrap"> <div id="divwrap">...</div></td>

您可以使用以下javascript调用：

// set cell width to its inner div width (in pixel)
$('#tdwrap').width($('#divwrap').width());

// set the div width back to its parent cell width (in pixel)
$('#divwrap').width($('#tdwrap').width());

然后，您可以设置div的宽度：

#divwrap {
    width: 30%;
}

这样，您可以让单元格宽度调整为其内部div的宽度，该宽度基于其父单元格的宽度！:p

示例：http://jsfiddle.net/william/S8Bne/89/

请注意，我在代码片段中使用了jQuery库。

这就是你要找的吗？

Answer 2

这只是一些建议，但根据我的经验，很难让Tables和Div很好地结合在一起，特别是如果你有一个跨浏览器的测试环境。

显然，只要有可能，尽量只使用Div，除非有大量的表格数据，否则使用表格可能是合适的。您的示例似乎证明了表的用法。我个人会尝试去掉表格div中的，只将CSS应用到表格单元格中。

祝你好运。

Answer 3

您可以在<td>上尝试使用style="width: -moz-fit-content;"