Вот моя кнопка элемент:IE7 обрезает текст внутри элемента Button
<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 текст отключен - появляется только «Let».
Извлечение пролета и сильных классов отобразит текст целиком, так как будет задан ширину класса .btn-submit. Проблема в том, что мне нужны фоновые изображения, предоставляемые диапазоном и сильными классами, и я не знаю, как долго текст кнопки будет таким образом, не может назначить ширину классу .btn-submit.
Любая помощь здесь много оценено. Благодаря!
css был первоначально разрезан компанией psd-to-xhtml. удалив его, спасибо! Вы можете помочь мне понять, почему это работает? (я все еще css-хакер) тем временем я обнаружил, что добавление 'white-space: nowrap;' в '.btn-submit' также устраняет проблему (сохраняя свойства float и height на' .btn -submit span' и '.btn-submit strong'. – kareem