Maison > interface Web > tutoriel CSS > le corps du texte

Pourquoi ma bordure de saisie Chrome disparaît-elle lors d'un zoom ?

Susan Sarandon
Libérer: 2024-11-08 22:08:02
original
278 Les gens l'ont consulté

Why does my Chrome input border disappear when zooming?

Dépannage de la disparition des bordures de Chrome lors du zoom

La préoccupation soulevée dans ce fil de discussion concerne la disparition des bordures de saisie dans Chrome lorsque les utilisateurs effectuent un zoom avant ou dehors. Bien que le problème ne concerne pas tous les utilisateurs, il affecte un formulaire spécifique (disponible sur http://jsfiddle.net/TKb6M/91/).

Lors d'un zoom à 90 %, par exemple, l'original les bordures disparaissent, laissant le champ de saisie visuellement sans fioritures. L'utilisateur mentionne également l'inclusion de balises basées sur les recommandations d'un autre fil de discussion, qui vise à allouer efficacement l'espace horizontal.

La question se pose de savoir s'il s'agit d'un problème avec le CSS ou d'un comportement spécifique de Chrome. De plus, l'utilisateur recherche des solutions pour éviter cet effet indésirable.

Solution proposée

Bien que l'affiche originale ait pu répondre au problème, un utilisateur astucieux est tombé sur une solution simple solution. En modifiant le code CSS, le problème peut être résolu.

CSS original

INPUT,TEXTAREA {
border-top: 1px solid #aaa
}
Copier après la connexion

CSS modifié

INPUT,TEXTAREA {
border-top: thin solid #aaa
}
Copier après la connexion

Cette modification remplace effectivement la valeur explicite "1px" par "thin", une unité relative. Par conséquent, la bordure conserve une apparence cohérente quel que soit le niveau de zoom.

La solution provient d'un fil de discussion sur un forum de produits Google : https://productforums.google.com/forum/#!topic/chrome/ r1neUxqo5Gc.

La mise en œuvre de cette simple modification devrait atténuer le problème de disparition des bordures dans Chrome, garantissant une expérience utilisateur visuellement cohérente tout en zoomer.

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!

source:php.cn
Déclaration de ce site Web
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
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!