Sélectionnez les problèmes de remplissage de liste dans Safari et IE : comment les résoudre ?

Problèmes de remplissage de liste dans Safari et IE

De nombreux développeurs ont rencontré des difficultés avec le remplissage qui ne fonctionnait pas comme prévu dans les listes de sélection lors de l'utilisation de navigateurs tels que comme Safari et Internet Explorer. Bien que la raison de ce problème ne soit pas bien définie dans la spécification W3, il s'agit d'une limitation connue des navigateurs WebKit, qui alimentent Safari et Chrome.

Solution :

Malgré le manque de prise en charge du remplissage, vous pouvez obtenir un effet similaire en utilisant plutôt l'indentation du texte. Cette méthode consiste à supprimer tout remplissage appliqué à la zone de sélection et à ajouter une quantité équivalente à sa largeur. De plus, définissez la propriété text-indent sur la même valeur.

Exemple :

Considérez le code suivant :

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

Dans cet exemple , le remplissage d'origine de 15 px a été supprimé du style de la zone de sélection. Au lieu de cela, la largeur est augmentée de 15 px pour s'adapter à l'indentation du texte, garantissant ainsi que l'effet visuel reste cohérent sur les différents navigateurs.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!