我的布局类似于：
<div>
<table>
</table>
</div>
我希望div只扩展到表的宽度。
当前回答
解决方案是将div设置为display:inline块。
其他回答
不知道这将出现在什么上下文中，但我相信CSS样式的属性float（向左或向右）将产生这种效果。另一方面，它也会有其他副作用，例如允许文本在其周围浮动。
如果我错了，请纠正我，我不是100%确定，目前无法自己测试。
这里有一个工作演示-
.浮动框{显示：-moz内联堆栈；显示：内联块；宽度：配合内容；高度：配合内容；宽度：150px；高度：75px；边距：10px；边框：3px实心#73AD21；}<h2>The Way正在使用内联块</h2>CSS中还添加了支持元素。＜div＞<div class=“floating box”>浮动框</div><div class=“floating box”>浮动框</div><div class=“floating box”>浮动框</div><div class=“floating box”>浮动框</div><div class=“floating box”>浮动框</div><div class=“floating box”>浮动框</div><div class=“floating box”>浮动框</div><div class=“floating box”>浮动框</div></div>
尝试显示：inline block；。为了实现跨浏览器兼容，请使用以下css代码。
第二部分{显示：内联块；显示：-moz内联堆栈；缩放：1；*显示：内联；边框样式：实心；边框颜色：#0000ff；}＜div＞<表><tr><td>第1列</td><td>第2列</td><td>第3列</td></tr></table></div>
我们可以对div元素使用以下两种方法中的任意一种：
display: table;
or,
display: inline-block;
我更喜欢使用display：table；，因为它自己处理所有额外的空间。而display:inline块需要一些额外的空间修复。
您可以选择高度：100%和宽度。这使得div不大于其内容。
