我的布局类似于:

<div>
    <table>
    </table>
</div>

我希望div只扩展到表的宽度。


当前回答

有两种更好的解决方案

显示:内联块;或显示:表格;

其中有两个显示:表;更好,因为显示:内联块;增加额外的边距。

用于显示:内联块;可以使用负边距方法来修复多余的空间

其他回答

修订版(如果您有多个孩子,则适用):您可以使用jQuery(查看JSFiddle链接)

var d= $('div');
var w;


d.children().each(function(){
 w = w + $(this).outerWidth();
 d.css('width', w + 'px')
});

不要忘记包含jQuery。。。

在此处查看JSfiddle

div{
  width:auto;
  height:auto;
}

尝试显示:inline block;。为了实现跨浏览器兼容,请使用以下css代码。

第二部分{显示:内联块;显示:-moz内联堆栈;缩放:1;*显示:内联;边框样式:实心;边框颜色:#0000ff;}<div><表><tr><td>第1列</td><td>第2列</td><td>第3列</td></tr></table></div>

第二部分{宽度:配合内容;}<div><表></table></div>

不知道这将出现在什么上下文中,但我相信CSS样式的属性float(向左或向右)将产生这种效果。另一方面,它也会有其他副作用,例如允许文本在其周围浮动。

如果我错了,请纠正我,我不是100%确定,目前无法自己测试。