Мобильная версияПроверьте следующий фрагмент кода. Объявление height: 100%; учитывается во всех браузерах мэра, кроме Safari. Для Safari flex-basis: 50px; очевидно «аннулирует» настройку высоты.
Я считаю, что это ошибка в Safari. Однако, поскольку компоновка не является простой, я недостаточно знаю о спецификациях, чтобы быть уверенным. Кто-нибудь знает, является ли поведение других браузеров «правильным» или это просто серая зона? И если это ошибка, куда мне о ней сообщить?
Браузеры пробовали:
[*]Хром 116 [*]Эдж 117 [*]Firefox 118 [*]Сафари 16.6
body { фон: зеленый; } .outer { дисплей: гибкий; гибкое направление: столбец; высота: 300 пикселей; ширина: 500 пикселей; фон: черный; } .середина { дисплей: гибкий; гибкое направление: столбец; высота: 100%; гибкая основа: 50 пикселей; /* это объявление имеет значение ТОЛЬКО в Safari */ ширина: 400 пикселей; фон: красный; } .внутренний { гибкий: 1; минимальная высота: 700 пикселей; ширина: 100 пикселей; фон: синий;
Вот как это выглядит в Safari:
А вот как это выглядит в других браузерах:
