Я сделал демо-версию игры Tailwind. https://play.tailwindcss.com/2xRDmC52V7 Это упрощенная версия происходящего. Эта часть представляет собой открытие мегаменю, отсюда и свойство absolute.
При использовании absolute в Safari все становится странно. Я сделал пример в TailwindCSS, поскольку это просто. Та же проблема существует и с обычным CSS. Я ищу решение с любым из них.
Скриншот Safari ниже.
См. элемент div с красной рамкой, он должен быть вокруг всего содержимого.
Скриншот Chrome ниже
Вот как это должно выглядеть.
Проблема
В Safari div не принимает ширину содержимого, поэтому пункты меню выходят за пределы контейнера div. Я не могу установить ширину, поскольку меню динамическое (длина контента разная). И установка ширины 100% также не работает, поскольку она принимает ширину родительского пункта меню (которая очень мала).
Как это исправить, не задавая явную ширину?
Воспроизведение
Lorem ipsum 1 Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum 2 Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum 3 Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum 4 Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum 5 Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsu.. 6 Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum хвостовой ветер.конфигурация = {}
