html - 自动换行所有文本并使 div 适合 child 的大小？

Question

我有以下 html 代码:

<div class="container">
    This is just some text. This is just some text. This is just some text.<br><br>
    <label>Input: <input type="text"></label>
</div>

我需要 div 是 <label> 的宽度以及要换行的文字。

没有文本，我可以制作 .container 内联 block ，使其适合标签，但否则它会随文本一起拉伸(stretch)。

这可能吗？

Answer 1

以下示例使用 CSS 来完成此操作:display: table-caption; 在 div 上，以及 white-space: nowrap;在标签上。

单击下面的“运行代码片段”按钮以查看其实际呈现方式。 (它只是带有嵌入式 CSS 的 HTML；没有 JavaScript。)

<div class="container" style="display: table-caption;">
	This is just some text. This is just some text. This is just some text.<br><br>
	<label style="white-space: nowrap;">Input: <input type="text"></label>
</div>