CSS white-space nowrap不会增加宽度？

Question

我正在<select>使用div和jquery 重建类似于框的下拉菜单.包含下拉项目的div应该具有最小宽度,但没有最大宽度,因为它应该与列表中最宽的项目一起增长(所以如果我有非常长的项目,如'[这是容器中最长的项目]',整个容器应该与此条目一样宽.

现在我几乎得到了我想要的东西,white-space:nowrap用于容器中的每个项目,以便项目的文本不会在新行上继续.使用的问题是文本流动开箱即用,而不是让框沿文本增长.我无法弄清楚如何解决这个问题.我已经尝试了,text-overflow:ellipsis但似乎只是隐藏溢出的文本并在末尾添加三个点(...).

简而言之,这就是我的问题:如何将div与其中的文本一起生长,何时white-space:nowrap应用于它,而不是让文本流出它？我不想隐藏文本使用overflow:hidden,我想显示整个字符串..

提前致谢!

Answer 1

块元素的宽度不依赖于它们在普通CSS静态布局模型中的内容.您可以将"缩小到适合"行为作为其他布局属性的一部分:

• float: left
• position: absolute
• display: inline-block
• 表

假设没有明确width设置.