我的布局类似于:

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

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


当前回答

<table cellpadding="0" cellspacing="0" border="0">
    <tr>
        <td>
            <div id="content_lalala">
                this content inside the div being inside a table, needs no inline properties and the table is the one expanding to the content of this div =)
            </div>
        </td>
    </tr>
</table>

我知道人们有时不喜欢表格,但我必须告诉你,我尝试了css内联技巧,它们在一些div中有点奏效,但在其他div中没有,所以,将扩展的div封装在表格中真的很容易。。。和它可以有内联属性,也可以没有内联属性,但表仍然是保持内容总宽度的表。=)

其他回答

解决方案是将div设置为display:inline块。

您需要一个具有CSS所称的收缩以适应宽度的块元素,而规范并没有提供一种获得这种东西的好方法。在CSS2中,缩小尺寸并不是一个目标,而是指处理浏览器“必须”凭空获得宽度的情况。这些情况包括:

浮动绝对定位元件内联块元素表元素

当没有指定宽度时。我听说他们想在CSS3中添加你想要的内容。现在,就用上面的一个吧。

不直接曝光该功能的决定可能看起来很奇怪,但有充分的理由。它很贵。缩小到适合意味着至少设置两次格式:在知道元素的宽度之前,不能开始设置元素的格式,并且不能计算整个内容的宽度。此外,人们不需要像想象的那样经常收缩以适应元素。为什么你的桌子周围需要额外的div?也许你只需要表格标题。

有两种更好的解决方案

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

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

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

个人而言,我只是这样做:

HTML代码:

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

CSS代码:

div {
    display: inline;
}

如果在div上应用浮点数,它也会起作用,但显然,您需要在下一个HTML元素中应用“清除两者”的CSS规则。

我在一个div中有一个span,只需在容器div中设置margin:auto就可以了。