我的布局类似于:
<div>
<table>
</table>
</div>
我希望div只扩展到表的宽度。
我的布局类似于:
<div>
<table>
</table>
</div>
我希望div只扩展到表的宽度。
当前回答
只需将样式放入CSS文件
div {
width: fit-content;
}
其他回答
尝试显示:inline block;。为了实现跨浏览器兼容,请使用以下css代码。
第二部分{显示:内联块;显示:-moz内联堆栈;缩放:1;*显示:内联;边框样式:实心;边框颜色:#0000ff;}<div><表><tr><td>第1列</td><td>第2列</td><td>第3列</td></tr></table></div>
第二部分{宽度:配合内容;}<div><表></table></div>
<div class="parentDiv" style="display:inline-block">
// HTML elements
</div>
这将使父div宽度与最大元素宽度相同。
尝试使用width:max-content属性根据div的内容大小调整其宽度。
试试这个例子,
<!DOCTYPE html>
<html>
<head>
<style>
div.ex1 {
width:500px;
margin: auto;
border: 3px solid #73AD21;
}
div.ex2 {
width: max-content;
margin: auto;
border: 3px solid #73AD21;
}
</style>
</head>
<body>
<div class="ex1">This div element has width 500px;</div>
<br>
<div class="ex2">Width by content size</div>
</body>
</html>
您可以选择高度:100%和宽度。这使得div不大于其内容。