IE7 Проблемы с отображением

Question

Многие мои поплавки отображаются в отдельной строке при просмотре в IE7 ... в Ffox, chrome, IE8 и т. Д. Они выглядят нормально.

Сайт, о котором идет речь:

http://208.43.52.30

Места, где поплавок не работает, - это место для «событий рядом со мной», «Показать» для кнопок показа месяца.

Я приложу несколько скриншотов

IE 8:

IE 7:

Answer 1

IE7 может увеличить ваш ввод (исходя из опыта), вы должны установить другую ширину для IE7.

Answer 2

Лично я не вижу разницы (самое близкое, что у меня есть к IE7, это представление совместимости в IE8), но на основе ваших скриншотов выглядит, что «Предстоящие события» font-size намного больше на скриншоте IE7.

Вы определили font-size для своего h1 тега?Разные браузеры иногда обрабатывают размер и поля тегов заголовков по-разному, поэтому, если вы добавите h1{font-size:14px;} в таблицу стилей, возможно, она исправит это.

Answer 3

Проблема наступающих событий вызвана тем, что IE7 выдвигает float:right на следующую строку вместо того, чтобы держать его в соответствии с h1, несмотря на отсутствие clear. Я не могу найти способ остановить это. Альтернативой, которую я придумал, было плавающее h1 влево вместо этого и значение по умолчанию text-alignment:right;. Это приведет к тому же макету, и IE7 будет счастлив.

http://jsfiddle.net/znRxq/

То же решение для кнопки показа.

Answer 4

Во-первых, float довольно хорошо поддерживается даже в IE.При проверке HTML на вашем сайте, я получаю 43 ошибок (на самом деле не так много).Исправьте их и посмотрите, решит ли это проблему.Более ранние версии IE (<= 7) не так дружелюбны к слегка недопустимой разметке, как IE8, chrome, firefox и т. Д.: inline-block '- самый простой способ.Вопреки распространенному мнению, это поддерживается в IE7 и 8. Вот CSS для кросс-браузерной поддержки: </p>

.inline-element {
  display:-moz-inline-stack;
  display:inline-block;
  zoom:1;
  *display:inline;
}