0
Voici mon élément bouton:texte IE7 coupe à l'intérieur d'un élément Button
<button type="submit" class="btn-submit"><span><strong>Let Me In, please!</strong></span></button>
et voici le CSS: "Laissez-moi, s'il vous plaît"
.btn-submit { margin: 0; padding: 0; border: none; font-family: Helvetica, Arial, sans-serif; font-size: 1.2em; line-height: 2em; font-weight: bold; color: #525252; background: none; }
.btn-submit span { display: block; float: left; height: 24px; margin: 0; padding: 0 0 0 5px; background: url(../images/btn-submit-left.png) no-repeat 0 0; }
.btn-submit strong { display: block; float: left; height: 24px; margin: 0; padding: 0 13px 0 8px; line-height: 2em; background: url(../images/btn-submit-right.png) no-repeat 100% 0; }
Le problème est que dans IE7 le texte est coupé - seul "Let" apparaît.
La suppression de la classe span et strong affichera le texte dans son intégralité, tout comme la définition d'une largeur dans la classe .btn-submit. Le problème est que j'ai besoin des images d'arrière-plan fournies par les classes span et strong, et je ne sais pas combien de temps le texte du bouton sera donc ne peut pas assigner une largeur à la classe .btn-submit. Toute aide ici beaucoup apprécié. Merci!
le css a été découpé à l'origine par une société de type psd-à-xhtml. l'enlever fonctionnait, merci! pouvez-vous m'aider à comprendre pourquoi cela fonctionne? (je suis toujours un hacker css) pendant ce temps, j'ai trouvé que l'ajout de 'white-space: nowrap;' à '.btn-submit' corrigeait aussi le problème (tout en gardant les propriétés float et height sur' .btn -submit span' et '.btn-submit strong'. – kareem