Hallo miteinander,
ich konnte beim Testen der Cross-Browser-Kompatibilität eines privaten Projektes ein "interessantes" Phänomen bezüglich des Verhaltens des Browsers MS Edge beobachten (in allen anderen "großen" Browsern passiert dies nicht) und wollte einmal in die Runde fragen, ob jemand ähnliche Erfahrungen bzw. vielmehr mögliche Erklärungsversuche dafür hat:
Mein Projekt nutzt CSS-Hyphens mit Vendor-Prefixes und da dies nicht für alle Browser reicht als Fallback auch den JS-Hyphenator, der meines Wissens nur in Aktion tritt, wenn die CSS-Hyphens nicht greifen. MS Edge reagiert auf beide Arten, Worte automatisch bei Bedarf zu trennen, aber leider nicht an allen Stellen.
Ich habe an einer Stelle ein recht komplexes und verschachteltes Flexbox-Layout mit einigen Textboxen. Dort sind längere Wörter enthalten, die beim Nicht-Trennen dafür sorgen, dass das Layout kaputt geht und die Boxen aus dem Sichtbereiches des Browsers ausbrechen (in allen möglichen Bildschirmgrößen).
Dieses Verhalten ist in keinem anderen Browser zu beobachten, diese Wörter sind dort stets sowohl durch CSS-Hyphens, als auch durch JS-Hyphenator trennbar. Und im MS Edge natürlich auch, wenn ich testweise Soft-Hyphens einsetze, dann funktioniert mein Layout problemlos und die Inkompatibilität mit dem Flexbox-Layout ist nicht existent.
Das Problem ist also die nicht vorhandene Worttrennung und in der Folge das Missachten oder Aufbrechen von Layout-Anweisungen durch den Browser.
Weiß zufällig jemand was man da machen kann (außer natürlich auf MS-Browser zu verzichten), da ich meine Textinhalte selbstverständlich nicht händisch mit Soft-Hyphens versehen möchte?
ich konnte beim Testen der Cross-Browser-Kompatibilität eines privaten Projektes ein "interessantes" Phänomen bezüglich des Verhaltens des Browsers MS Edge beobachten (in allen anderen "großen" Browsern passiert dies nicht) und wollte einmal in die Runde fragen, ob jemand ähnliche Erfahrungen bzw. vielmehr mögliche Erklärungsversuche dafür hat:
Mein Projekt nutzt CSS-Hyphens mit Vendor-Prefixes und da dies nicht für alle Browser reicht als Fallback auch den JS-Hyphenator, der meines Wissens nur in Aktion tritt, wenn die CSS-Hyphens nicht greifen. MS Edge reagiert auf beide Arten, Worte automatisch bei Bedarf zu trennen, aber leider nicht an allen Stellen.
Ich habe an einer Stelle ein recht komplexes und verschachteltes Flexbox-Layout mit einigen Textboxen. Dort sind längere Wörter enthalten, die beim Nicht-Trennen dafür sorgen, dass das Layout kaputt geht und die Boxen aus dem Sichtbereiches des Browsers ausbrechen (in allen möglichen Bildschirmgrößen).
Dieses Verhalten ist in keinem anderen Browser zu beobachten, diese Wörter sind dort stets sowohl durch CSS-Hyphens, als auch durch JS-Hyphenator trennbar. Und im MS Edge natürlich auch, wenn ich testweise Soft-Hyphens einsetze, dann funktioniert mein Layout problemlos und die Inkompatibilität mit dem Flexbox-Layout ist nicht existent.
Das Problem ist also die nicht vorhandene Worttrennung und in der Folge das Missachten oder Aufbrechen von Layout-Anweisungen durch den Browser.
Weiß zufällig jemand was man da machen kann (außer natürlich auf MS-Browser zu verzichten), da ich meine Textinhalte selbstverständlich nicht händisch mit Soft-Hyphens versehen möchte?