/ / iPad Air zeigt meine Foundation 6-Seite nicht richtig an - zurb-foundation, ipad-3

iPad Air zeigt meine Foundation 6 Seite nicht richtig an - zurb-foundation, ipad-3

Ich verwende Foundation 6 in einer Wordpress-Site. Das Problem, mit dem ich konfrontiert bin, passiert ausschließlich auf iPad Air. Es funktioniert gut auf älteren iPads und allen anderen Geräten und Browsern. Was passiert ist, dass ich 6 kleine 2 Spalten habe, aber die letzte wird in einer neuen Zeile angezeigt. Ich verstehe nicht, wie das passieren kann. Bildbeschreibung hier eingeben

Hier ist die Seite: https://lagalope.com/the-collection-2/

Hier ist die HTML-Struktur:

<div class="row">
<div class="small-2 column">
content....
</div>
<div class="small-2 column">
content....
</div>
<div class="small-2 column">
content....
</div>
<div class="small-2 column">
content....
</div>
<div class="small-2 column">
content....
</div>
<div class="small-2 column">
content....
</div>
</div>

Wenn ich das in einem JSFiddle reproduziere, funktioniert das gut und es bedeutet, dass etwas in meinem Wordpress-Theme nicht stimmt ...: https://jsfiddle.net/curuba/s5twohf5/2/

[BEARBEITEN] Es scheint, dass es gelöst ist, wenn ich Flexgitter meide. Wenn ich die folgende Zeile kommentiere, ist alles in Ordnung:

@include foundation-flex-grid;

Ich verstehe nicht, warum dies das Problem verursacht. Ich lasse diese Frage unbeantwortet, da dies nur eine weitere Richtung für die Ursache ist, aber keine Lösung.

Antworten:

0 für die Antwort № 1

Versuche dies :

// Fix ios flex bug
.row {
.column:first-child {
flex: 1 1 0;
}
}