Maison  >  Article  >  interface Web  >  Pourquoi ma zone de texte a-t-elle un espace supplémentaire en dessous ?

Pourquoi ma zone de texte a-t-elle un espace supplémentaire en dessous ?

DDD
DDDoriginal
2024-11-07 08:31:02909parcourir

Why Does My Textarea Have Extra Space Underneath?

Espace supplémentaire sous la zone de texte : incohérences dépendantes du navigateur

Problème : Un espace blanc supplémentaire est observé sous les balises de la zone de texte, avec des variations de 1 à 4 pixels selon les différents navigateurs. Le balisage HTML utilisé est simple :

<code class="html"><textarea>...</textarea></code>

Pourquoi l'écart apparaît
Textarea, étant un élément en ligne (ou bloc en ligne), réserve de l'espace pour les descendants dans le texte. En conséquence, un espace peut apparaître sous la zone de texte. La variation de la taille de l'écart entre les navigateurs reste floue.

Solution : ajustement de l'alignement vertical
Pour éliminer l'espace supplémentaire, modifiez le CSS pour la zone de texte :

<code class="css">textarea {
  vertical-align: top;
  /* Additional CSS rules from the original code omitted for brevity */
}</code>

Explication
En définissant l'alignement vertical sur le haut, la zone de texte est alignée verticalement avec le haut de son contenu, supprimant efficacement l'espace réservé aux descendeurs et résolvant l'espace sans conséquence.

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn