Ich dachte Safari hätte das sortiert, aber es scheint immer noch ein Problem zu sein (es sei denn, ich mache etwas offensichtlich falsch).
Ich habe ein SVG in einem Objekt-Tag platziert. Das ist in einem flexiblen enthaltenden DIV (z.B. mit einer Breite von 50%) verpackt. Bei der Größenänderung wird die Containerhöhe in Firefox, Chrome und Opera so geändert, wie ich es erwarten würde, aber auf Safari bleibt der Container zu hoch.
Hier ist ein Beispiel auf Codepen zu demonstrieren, wechseln Sie zum Ergebnis voller Größe oder 'Editor auf der Seite' (Button unten rechts), um den Effekt in Safari klar zu sehen: Ссылка
Weiß jemand neben der Verwendung von JS zur Größenänderung des SVG beim Laden / Ändern der Größe, ob ich noch etwas tun kann, damit sich Safari korrekt verhält? Könnte geschworen haben, dass ich das vor ein paar Wochen herausgefunden habe, aber jetzt scheint ich das Thema wieder zu treffen.
Also hatte Sérgio Lopez eine Antwort darauf. Sie können das intrinsische Verhältnis für Videotechnik anwenden, das Thierry Koblentz hier beschrieben hat: Ссылка . Weitere Informationen in diesem Blogbeitrag: Ссылка
Hier ist der Code zum Ausschneiden und Einfügen, den Sie in Ihrem CSS benötigen:
Umliegendes Objekt-Tag
%Vor%Und das für die SVG im Inneren:
%Vor%Tags und Links svg inline responsive-design safari