Probleme beim Auffüllen von Listen in Safari und IE: Wie kann man sie lösen?

Probleme beim Auffüllen von Auswahllisten in Safari und IE

Viele Entwickler hatten Schwierigkeiten damit, dass das Auffüllen in Auswahllisten bei Verwendung von Browsern wie z. B. nicht wie erwartet funktionierte wie Safari und Internet Explorer. Obwohl der Grund für dieses Problem in der W3-Spezifikation nicht genau definiert ist, handelt es sich um eine bekannte Einschränkung der WebKit-Browser, die Safari und Chrome unterstützen.

Lösung:

Obwohl das Auffüllen nicht unterstützt wird, können Sie einen ähnlichen Effekt erzielen, indem Sie stattdessen Texteinzüge verwenden. Bei dieser Methode wird die auf das Auswahlfeld angewendete Polsterung entfernt und der Breite des Auswahlfelds ein entsprechender Betrag hinzugefügt. Legen Sie außerdem die text-indent-Eigenschaft auf denselben Wert fest.

Beispiel:

Betrachten Sie den folgenden Code:

<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>

In diesem Beispiel , wurde der ursprüngliche Abstand von 15 Pixel aus dem Auswahlboxstil entfernt. Stattdessen wird die Breite um 15 Pixel erhöht, um die Texteinrückung zu berücksichtigen und sicherzustellen, dass der visuelle Effekt in verschiedenen Browsern konsistent bleibt.

Das obige ist der detaillierte Inhalt vonProbleme beim Auffüllen von Listen in Safari und IE: Wie kann man sie lösen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!