Как я могу получить эту кнопку для правильного выравнивания в IE7?

Question

Я пытаюсь заставить IE7 правильно выровняться с элементом над ним.

Это пример того, как все должно выглядеть:

но вот как это выглядит в IE7:

Этот HTML-код я использую (для лучшего эффекта просмотрите IE в режиме IE7!): http://jsfiddle.net/ZHfbF/2/

Есть ли способ заставить меня вести себя так, как показано на верхнем изображении?

Answer 1

Я задал вопрос +1, но, честно говоря, если это худшая проблема с макетом, которая у вас есть в IE7, я бы просто принял ее и проигнорировал, и был бы очень благодарен, что она не хуже.

В настоящее время, глядя на эти снимки экрана, пользователь IE7 даже не собирается замечать, что есть проблема, поэтому я не стал бы слишком зацикливаться на этом.

Кстати, вы упоминаете об использовании "режима IE7" - обратите внимание, что режимы совместимости IE не отображаются точно так же, как реальная копия IE7. В режиме совместимости есть несколько сбоев и ошибок макета, которые не появляются ни в реальном IE7, ни в IE8 в его стандартном режиме. Соблюдайте осторожность при использовании режима совместимости для тестирования.

Answer 2

Добавьте overflow:visible к вашей кнопке, это уберет тот горизонтальный отступ, который IE добавляет к кнопке в зависимости от текста, который он содержит.

Как это:

#btnViewResults {
    float: right;
    padding-right: 7px;
    overflow: visible;
}