Darstellungsfehler im IE

  • Moin!
    Ich habe bei IE einen Fehler auf einigen Seiten. Bin auch mit meinem Latein am Ende. Ich hoffe mir kann hier geholfen werden

    Es geht u.a. um diese Seiten hier:
    http://wordpresstest.talker-lounge.de/podcast/die-talker-lounge-66/
    http://wordpresstest.talker-lounge.de/team/florian/

    Der Fehler in der Darstellung sieht aus dass die rechte Box ganz schmal wird. Ich habe es auch schon gesehen das der Fehler darin bestand das der Text der rechten Box immer weiter nach rechts ging. Weiß sonst nicht wie ich den Fehler besser beschreiben sollte :(

    Der Fehler tritt auch nur im IE auf. Unter Chrome, Firefox, Edge und Opera gab es bei mir nichts zu bemängeln

    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren

  • Hallo

    Leider hast du nicht die IE-Version genannt.

    Ich habe mir die Seiten im IE11 angeschaut.

    Der hat Probleme bei der Darstellung der linken Box, nicht der rechten. Dort wird der Text mit jeweils einem Buchstaben in einer Zeile angezeigt.

    Ursache ist, dass der IE11 Flexbox zwar gerne können will, aber nicht richtig kann. Ob das auch für neuere IE-Versionen gilt weiß ich leider nicht.

    Flexbox kann und sollte auch mit dem IE11 verwendet werden, aber seine Eigenheiten müssen dabei berücksichtigt werden.

    In diesem Fall ist es die Anweisung

    Code
    display: inline-flex

    im Zusammenhang mit der Kurzanweisung

    Code
    flex: 1

    Bei der Kurzschreibweise werden alle drei betroffenen Werte geändert, wobei der IE11 wohl bei der flex-basis andere Werte als die meisten anderen Browser setzt.

    Außerdem wird die Anweisung

    Code
    box-sizing: border-box

    verwendet. Bei Flexbox verwendet der IE11 jedoch grundsätzlich das Standard-Box-Modell, also content-box. Das lässt sich leider auch nicht ändern oder anpassen.

    Am sinnvollsten ist wohl statt display: inline-flex zunächst display: flex zu verwenden. Wenn es dann noch Probleme gibt müssen eventuell noch die Kurzschreibweise und das Box-Modell angepasst werden.

    Laut Inspektor befindet sich die Anweisung display: inline-flex in der Klasse .podcasteinzel in der Datei autoptimize_3de19db6eedb6f39ec147386d9b68249.css

    Gruss

    MrMurphy

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!