CSS：最大宽度不会缩小？ [复制]答案

【问题标题】：CSS: Max-Width won't shrink? [duplicate]CSS：最大宽度不会缩小？ [复制]
【发布时间】：2012-09-22 06:03:11
【问题描述】：

可能重复：
Make CSS Div Width Equal To Contents

我正在尝试制作一个类似聊天的应用程序，但现在我遇到了某种小错误。

我有一个最大宽度设置为 350 像素的 div。但是当我把下面的文字放进去时：

dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd

它将在每个空间添加新行，但 div 的宽度将保持在 100px。我在这里在 jsFiddle 中做了一个小例子：

如您所见，黄色框的宽度是 100 像素，而我希望它缩小到文本的宽度。我也尝试使用元素来修复它，但黄色框保持不变。

基本上我希望它看起来像第三个框，同时保留最大宽度部分。

有人知道黄色框如何缩小到文本的宽度吗？

【问题讨论】：

【解决方案1】：

使用段落

<p></P>

演示：fiddle

【讨论】：

不完全是我要找的地方。基本上我希望它看起来像这个小提琴中的第三个框：jsfiddle.net/5t2hm/12 但是第三个框没有设置最大宽度，但这是项目所需要的。
是的，我愿意帮助你。但我不明白。你能在这里插入图片吗..
对不起。我重新检查了你的答案，如果我添加
标签，确实 div 的行为会改变。但是这是不可能的，因为它应该呈现人工输入，然后我需要检查一种方法，当某个句子太长时它会添加

标签。然而，它正确呈现的标签！谢谢！

【解决方案2】：

DIV 的默认宽度是 100%，因此 max-width 只是在您的小提琴中限制它 - 它不会考虑内容的宽度。

要将您的 DIV 缩小到其内容，您需要 display: inline-block; 或 float:left; width:auto;。

【讨论】：

【解决方案3】：

检查此fiddle1 或fiddle2。

不要使用一个div，而是使用两个div（或）
一个div 和一个span。我想这就是你想要的。

【讨论】：