CSS-пробел теперь не увеличивает ширину? - PullRequest
13 голосов
/ 25 октября 2010

Я восстанавливаю выпадающее меню, подобное <select>, используя div и jquery.Элемент div, содержащий выпадающие элементы, должен иметь минимальную ширину, но не максимальную ширину, поскольку он должен расти вместе с самым широким элементом в списке (поэтому, если у меня есть очень длинный элемент, например «[Это самый длинный элемент в контейнере]»,весь контейнер должен быть такой же ширины, как эта запись.

Теперь я почти получил то, что хотел, используя white-space:nowrap для каждого элемента в контейнере, чтобы текст элемента не продолжался на новомПроблема в том, что текст выходит из поля, используя вместо того, чтобы позволить блоку расти вдоль текста. Я не могу понять, как решить эту проблему. Я уже пробовал text-overflow:ellipsis, но это, кажется, просто скрываетпереполненный текст и добавление трех точек (...) в конце.

Итак, вот моя проблема в двух словах: как я могу позволить div расти вместе с текстом внутри него, когда white-space:nowrapЯ не хочу скрывать текст, используя overflow:hidden, я хочу показать всю строку ..

Заранее спасибо!

Ответы [ 3 ]

19 голосов
/ 25 октября 2010

Ширина элементов блока не зависит от их содержимого в обычной модели статического макета CSS. Вы можете получить поведение «сжатие к размеру» как часть других свойств макета:

  • float: left
  • position: absolute
  • display: inline-block
  • таблица

при условии, что не задано явное width.

1 голос
/ 06 января 2015

Есть ли максимальная ширина, установленная в каком-либо из родительских элементов выбора?

Это остановит работу свойства пробела. display: table переопределяет максимальную ширину, если она установлена, однако.

1 голос
/ 24 октября 2013

У меня была похожая проблема, она была решена путем указания значения отступа в пикселях вместо процента.

...