修复td的宽度

Question

我在td中有一个div。 div中内容的宽度是可变的。当我单击div时，我将div的position属性从static更改为absolute。当我更改其中div的position属性时，td会丢失其宽度。

有关说明，请参阅此jsfiddle。

当div从静态定位变为绝对定位时，我不希望td调整大小。怎么样？

Answer 1

td正在调整大小，因为创建td宽度的div正在取出自然文档流。在这一点上，td认为自己与div无关。

如果你希望它保持这个大小，你需要根据div的宽度设置td的宽度。

<强>更新

以下是一种可以快速实现目标的方法：http://jsfiddle.net/2A2rR/3/ （这不完美，但你得到了一般的想法）

Answer 2

jQuery(function() {
    jQuery('#widthKeeper').click(function() {
           var divWidth = $("table tr td:firstchild").css(width);
           jQuery(this).css('position', 'absolute');
           jQuery("table tr td:firstchild").css('width',divWidth);
    });
});