Tutorials

Einige nützliche Hilfen und Code-Schnipsel, die ich immer wieder benötige und deshalb hier für alle sammle.

Zurück zur Übersicht

Input-Felder und Submit-Buttons für iPhone/iPad via CSS stylen

#Tutorials#CSS

Wenn man ein Formular für das iPhone oder iPad mit CSS stylen will, merkt man schnell, dass der mobile Safari einem die Styles gnadenlos kaputt macht.

So sollte es aussehen:

und so sieht es aus:

Nach einigen Recherchen habe ich dann folgende Lösung gefunden:


-webkit-appearance: none;
-moz-appearance: none;

Fügt man diesen Schnipsel zu seiner CSS-Datei hinzu dann sagt man dem mobilen Safari, dass er wirklich diesen Button nicht nach der Apple UI stylen soll.


Kommentare

  • Jörg Ludwig
    Dankbarer Tip! Hast du zufällig auch das Pendant für die -moz Browser. Ich habe nämlich ein Problem mit Formularfeldern auf einem Galaxy.

    Vielen Dank,
    Gruß
    Jörg Ludwig
    Antworten
    • admin
      Hi Jörg,

      das hat Mozilla wohl erst später eingeführt. Sollte aber laut:
      https://developer.mozilla.org/de/docs/Web/CSS/-moz-appearance

      so gehen:

      -moz-appearance: none;

      Viele Grüße
      André
      Antworten

Hinterlasse einen Kommentar

Antworten abbrechen

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind markiert *

Kommentar wird gespeichert
Danke für deinen Kommentar! Sobald er freigegeben wurde erscheint er hier.