css - IE7 切断 Button 元素内的文本

Question

这是我的按钮元素:

<button type="submit" class="btn-submit"><span><strong>Let Me In, please!</strong></span></button>

这是 CSS:

.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; }

问题是在 IE7 中“请让我进入!”文本被截断 - 只有“让”出现。

删除 span 和 strong 类将完整显示文本，为 .btn-submit 类设置宽度也是如此。问题是我需要 span 和 strong 类提供的背景图像，而且我不知道按钮文本有多长，所以无法为 .btn-submit 类分配宽度。

非常感谢这里的任何帮助。非常。谢谢!

Answer 1

有没有理由指定height和 float对于 .btn-submit span和 .btn-submit strong ？如果没有，我建议您删除它们。这将解决 ie7 的问题