Le retrait du texte CSS ne fonctionne pas sur IE7

Question

Voici l'exemple de page: http://jsfiddle.net/p9Fbb/

Fondamentalement, lorsque vous utilisez text-indent sur l'icône, Internet Explorer 7 (IE9 en mode de compatibilité) déplace l'élément hors de l'écran, pas seulement le texte.Pour une raison quelconque, cela ne se produit que dans certaines circonstances dans les cellules du tableau (je pense que c'est lorsque l'élément est seul dans une cellule).

Comment puis-je résoudre ce problème?Ou y a-t-il une autre façon d'utiliser le contenu textuel dans un élément mais de le garder invisible?

Answer 1

Il semble que le problème soit que votre espace soit devenu vide (ou sa taille devient 0 (pas sûr) ) après le retrait de texte, car il n'est pas affiché.Mettez du texte autour de votre span, vous verrez qu'il est toujours là.

voir cet jsFiddle pour un exemple.

utilisez display:block au lieu de display:inline-block.Les éléments en ligne n'aiment pas beaucoup la déclaration de taille (largeur / hauteur), ils sont faits pour être affichés à l'intérieur de quelque chose , prenant de la place en fonction de leur contenu .