IP Girl
  1. IP Girl
  3. overflow: hidden + display: le bloc en ligne déplace le texte vers le haut
Intereting Posts
Comment rechercher une valeur spécifique dans toutes les tables (PostgreSQL)? Le CPG JVM peut-il déplacer des objects au milieu d’une comparaison de référence, entraînant l’échec d’une comparaison même lorsque les deux côtés font référence au même object? Une redirection 302 maintiendra-t-elle la chaîne de référence? Liste des objects de ManyToManyField Comment fermer correctement une twig dans Mercurial? Comment attachez-vous et détachez-vous du processus de Docker? Comment connecter un émulateur Android à Internet Comment supprimer un mappage d’espace de travail TFS? Est-il possible d’instancier une classe par nom en Java? Quel est le but de l’instruction «PAUSE» dans x86? Comment charger en toute sécurité Polymer dans un environnement inconnu – plusieurs versions ou espaces de noms? Split ssortingng, convertit ToList () dans une ligne Comment faire un rebase avec git gui? Comment rechercher l’historique de git pour une ligne disparue? Comment vraiment lire le fichier texte de classpath en Java

overflow: hidden + display: le bloc en ligne déplace le texte vers le haut

J’ai le code HTML suivant: 

 abc

Ce que j’attends de voir: abc .

Ce que je vois (dans Chrome, Safari, Firefox): abc

b est supérieur à a et c . Pourquoi il en est ainsi et comment le réparer?

Cela se produit parce que l’élément inline-block a une hauteur égale à son parent et à son overflow: hidden entraîne l’alignement de son bord inférieur sur la ligne de base du texte du parent. En conséquence, l’espace disponible pour les descendants sur le texte est essentiellement doublé pour le ( JSFiddle ).

Vous pouvez résoudre ce problème en lui donnant également l’ vertical-align: bottom .