我的布局类似于:
<div>
<table>
</table>
</div>
我希望div只扩展到表的宽度。
我的布局类似于:
<div>
<table>
</table>
</div>
我希望div只扩展到表的宽度。
当前回答
width:1px;
white-space: nowrap;
对我来说很好:)
其他回答
好的,在很多情况下,您甚至不需要做任何事情,因为默认情况下,div的高度和宽度都是自动的,但如果不是这样,应用内联块显示将对您有效。。。看看我为你创建的代码,它会做你想要做的事情:
第二部分{显示:内联块;}<div><表><tr><td>Lorem ipsum dolor坐amet,consectetur adipiscing elit。Morbi ultrices feugiat massa sed laoreet。Maecenas et magna egestas,facilisis purus quis,前庭nibh</标准差><td>Nunc auctor aliquam est ac viverra公司。Sed enim nisi,feugiat Sed accumsan eu,convalis eget felis。Pellentesque consequat eu leo nec pharetra。直径为</td><td>Lorem ipsum dolor坐amet,consectetur adipiscing elit。Morbi ultrices feugiat massa sed laoreet。Maecenas et magna egestas,facilisis purus quis,前庭nibh</标准差></tr></table></div>
我通过在div标记中添加span标记,并将CSS格式从外部div标记移动到新的内部span标记,解决了一个类似的问题(我不想使用display:inline块,因为项目居中)。如果display:inline块不是适合您的答案,那么就把它作为另一个备选方案。
你的问题的答案在于未来,我的朋友。。。
即“内在”将随最新的CSS3更新而来
width: intrinsic;
不幸的是IE落后于它,所以它还不支持它
更多信息:CSS内部和外部尺寸模块级别3和我可以使用吗?:内在和外在尺寸。
现在,您必须满足<span>或<div>设置为
display: inline-block;
您可以尝试fit内容(CSS3):
div {
width: fit-content;
/* To adjust the height as well */
height: fit-content;
}
浏览器支持规格
这里有一个工作演示-
.浮动框{显示:-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>