Pourquoi `width: auto` ne fonctionne-t-il pas comme prévu pour les champs ``, et comment puis-je les faire remplir l'espace disponible ?

width:auto Comportement pour Champs

Question :

Malgré l'attente selon laquelle width:auto pour les éléments de niveau bloc permettrait à l'élément de remplir l'espace disponible, cela ne semble pas fonctionner chemin pour éléments. Clarifiez la définition de width:auto et suggérez une solution pour obtenir le comportement souhaité consistant à remplir l'espace disponible pour champs.

Réponse :

La largeur d'un champ L'élément est calculé en fonction de son attribut size, et non de la propriété de style width. La valeur de taille par défaut détermine la largeur automatique initiale.

Pour obtenir le comportement attendu de remplissage de l'espace disponible, essayez de définir width:100 % au lieu de width:auto.

Exemple :

<code class="html"><form action="" method="post" style="width:200px;background:khaki">
  <input style="width:100%" />
</form></code>

Remarque supplémentaire :

Pour affiner davantage la largeur, ajoutez des marges et des bordures négatives pour annuler les marges et bordures par défaut appliquées par le navigateur. Cela garantit la cohérence entre les différents navigateurs, sauf dans Internet Explorer, qui applique les bordures différemment.

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!