我的布局类似于:
<div>
<table>
</table>
</div>
我希望div只扩展到表的宽度。
我的布局类似于:
<div>
<table>
</table>
</div>
我希望div只扩展到表的宽度。
当前回答
个人而言,我只是这样做:
HTML代码:
<div>
<table>
</table>
</div>
CSS代码:
div {
display: inline;
}
如果在div上应用浮点数,它也会起作用,但显然,您需要在下一个HTML元素中应用“清除两者”的CSS规则。
其他回答
我认为使用
display: inline-block;
但我不确定浏览器的兼容性。
另一种解决方案是将您的div包装在另一个div中(如果您想保持块行为):
HTML格式:
<div>
<div class="yourdiv">
content
</div>
</div>
CSS:
.yourdiv
{
display: inline;
}
display:inline块为元素添加额外的边距。
我建议这样做:
#element {
display: table; /* IE8+ and all other modern browsers */
}
奖金:你现在只需添加margin:0auto,就可以轻松地将这个新奇的#元素居中。
在Firebug中我发现了属性值-moz fit content,它完全符合OP的要求,可以如下使用:
width: -moz-fit-content;
虽然它只在Firefox上运行,但我找不到其他浏览器(如Chrome)的等效版本。
width:1px;
white-space: nowrap;
对我来说很好:)
我只需要设置填充:-whateverYouWantpx;