Flexbox
iOS
Bei der Verwendung von Safari auf iOS wir der Inhalt eines als display: flex definierten Elements nicht angezeigt.1
Safari auf iOS zeigt ein Fehlverhalten bei der gleichzeitigen Verwendung eines Flexbox-Containers und gefloateten Elementen. In dieser Konstellation werden die gefloateten Elemente nicht angezeigt. Der Container nimmt aber trotzdem die benötigte Grösse ein.
Lösung
- Float entfernen (wird bei der Verwendung von flexbox, mit Ausnahme als Fallback, sowieso nicht benötigt)
- Flexbox-Elemente als position: relative definieren
Label
iOS
Beim Berühren des Labels wird das entsprechende Input Element nicht aktiviert
Safari auf iOS scheint bei Klicks auf ein <span>-Element innerhalb eines <label>-Elements den Klick zu ignorieren und selektiert das entsprechende Input-Element nicht.
Lösung
Über die CSS-Eigenschaft pointer-events: none; kann das Verhalten korigiert werden.