badger
Goto Top

Falsche Darstellung von Flexbox unter Safari

Hallo Leute,

ich habe aktuell ein Problem bei einer Webseite, wo ich absolut nicht mehr weiter weiß.
Ich habe einen Auszug des Quellcodes auf jsfiddle gestellt.

Sämtliche Browser die ich getestet habe (IE11, Chrome, FF, Edge) zeigen bei meinem Beispiel in der ersten "Zeile" 3 Bilder an und in der Zweiten 2 Bilder (so wie ich es auch haben will).
Safari (unter iOS) zeigt in der ersten "Zeile" 2 Bilder an und in der Zweiten 3 Bilder.

Warum??
Hat hier irgendjemand eine Idee, wo hier der Fehler begraben ist?

Besten Dank für eure Hilfe!

Patrick

P.S:
Ich weiß, dass man das Beispiel im Anhang auch anders lösen könnte.
Aber es handelt sich hierbei nur um einen Codeschnipsel von einem responsive Design. Und als Ganzes ergibt es dann wieder Sinn face-smile

Content-Key: 346562

Url: https://administrator.de/contentid/346562

Ausgedruckt am: 28.03.2024 um 21:03 Uhr

Mitglied: falscher-sperrstatus
falscher-sperrstatus 17.08.2017 um 11:59:40 Uhr
Goto Top
Wie immer: Wenn du uns die Seite zeigen würdest.

VG
Mitglied: Badger
Badger 17.08.2017 um 12:12:00 Uhr
Goto Top
Hallo,

Die Seite ist noch nicht online.
Ist der Quellcode auf jsfiddle zu wenig?

Grüße
Patrick
Mitglied: 133883
133883 17.08.2017 um 16:24:56 Uhr
Goto Top
Mit 33,33333% passt das eben nicht mehr in die erste Zeile und das 3 Bild floatet in die nächste Zeile, mach 33% draus dann passts wieder.

Gruß
Mitglied: Badger
Badger 17.08.2017 um 16:39:24 Uhr
Goto Top
Danke dir.
Auf das bin ich auch schon gekommen.

Aber:
  • wenn 33,33333% zu viel für eine Zeile ist: warum haben dann in der zweiten Zeile 3 Bilder nebeneinander Platz?
  • warum kann jeder mit 33,33333% umgehen aber der Safari nicht? Müsste ja dann eigentlich ein Bug sein, oder?

Grüße
Patrick
Mitglied: 133883
133883 17.08.2017 aktualisiert um 16:44:03 Uhr
Goto Top
Zitat von @Badger:

Danke dir.
Auf das bin ich auch schon gekommen.

Aber:
  • wenn 33,33333% zu viel für eine Zeile ist: warum haben dann in der zweiten Zeile 3 Bilder nebeneinander Platz?
Liegt am Floating und wie die Browser den Restplatz berechnen, bei den Apples ist das schon ewig so, wie bei allem immer eine Ausnahme ... Also Sicherheitsabstand einplanen oder auf das neue native flexible Gridsystem wechseln.
Mitglied: Badger
Badger 17.08.2017 aktualisiert um 17:45:10 Uhr
Goto Top
Zitat von @133883:
[...] oder auf das neue native flexible Gridsystem wechseln.

Kannst du mir sagen, was du da genau meinst?

Ich habe nun hier einen Workaround gefunden. Ergebnis ist hier zu sehen.
Mitglied: 133883
133883 17.08.2017 um 18:00:08 Uhr
Goto Top
Mitglied: Badger
Badger 17.08.2017 um 18:06:10 Uhr
Goto Top
Danke dir!