Wie formatiere ich Auswahllisten mit Auffüllung in Safari und IE trotz W3-Spezifikation?

Auswahllisten mit Padding in Safari und IE gestalten

Obwohl die W3-Spezifikation die Verwendung von Padding in Auswahlfeldern nicht verbietet, können Webkit-Browser wie z da Safari und Chrome diese Funktion nicht unterstützen. Um den gewünschten Effekt zu erzielen, sollten Sie die Eigenschaft padding-left durch text-indent ersetzen und dabei sicherstellen, dass die Breite des Auswahlfelds entsprechend angepasst wird.

Beispiel:

Im Folgenden Im Codeausschnitt wird die Eigenschaft „padding-left“ entfernt und durch „text-indent“ ersetzt:

<code class="html"><select id="sexID" name="user[sex]" 
        style="border:1px solid #C1272D;
               width:258px; // 243 + 15px
               text-indent:15px;
               height:25px;
               color:#808080;"></code>

Durch Hinzufügen des gleichen Texteinzugs, den das Padding belegt hätte, ist das Auswahlfeld jetzt linksbündig ausgerichtet Textfeld. Diese Problemumgehung simuliert effektiv das Padding-Verhalten in Safari und IE und sorgt so für ein konsistentes Styling-Erlebnis in verschiedenen Browsern.

Das obige ist der detaillierte Inhalt vonWie formatiere ich Auswahllisten mit Auffüllung in Safari und IE trotz W3-Spezifikation?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!