Я перестраиваю выпадающее меню, похожее на поле <select>
, используя div и jquery. Div, содержащий выпадающие элементы, должен иметь минимальную ширину, но не максимальную ширину, поскольку она должна расти вместе с самым широким элементом в списке (так что если у меня очень длинный элемент, например "[Это самый длинный элемент в контейнере]", весь контейнер должен быть таким же широким, как и эта запись.
Теперь я почти получил то, что хочу, используя white-space:nowrap
для каждого элемента в контейнере, чтобы текст элемента не продолжался в новой строке. Проблема заключается в том, что текстовые потоки выходят из окна, вместо того, чтобы позволить коробке расти вдоль текста. Я не могу понять, как решить эту проблему. Я уже пробовал text-overflow:ellipsis
, но похоже, что он просто скрывает переполненный текст и добавляет три точки (...) в конец.
Итак, вот моя проблема в двух словах: как я могу позволить div расти вместе с текстом внутри него, когда на него применяется white-space:nowrap
, вместо того, чтобы пропускать текст из него? Я не хочу скрывать текст, используя overflow:hidden
, я хочу показать всю строку.
Спасибо заранее!