Почему эта страница выглядит по-разному между IE, Firefox и Chrome

Question

Посмотрите на эту HTML-страницу .

В Firefox это выглядит так, как я хочу, в IE это выглядит "немного странно", а в Chrome все искажено.

Какой нестандартный HTML, который я использую, делает его таким разным в разных браузерах? В частности, как я могу исправить версии Chrome & IE, чтобы они больше походили на Firefox?

Обратите внимание, что Chrome теряет популярность, только если все или почти все столбцы имеют желтые стикеры. Если один или два столбца пусты, Chrome отображает страницу так же, как Firefox.

Редактировать - здесь фиксированная страница .

Answer 1

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

ОБНОВЛЕНИЕ: Хорошая работа по исправлению проверки! Ваша проблема сейчас в том, что элемент таблицы следует за двумя плавающими div без какой-либо очистки. Вы должны очистить плавающие элементы так, чтобы следующие элементы были правильно размещены под ними.

Попробуйте следующее. Google "clearfix" для более элегантного решения.

<div style="float:left">....
<div style="float:right">....
<br style="clear:both"/>
<table ....

Answer 2

Первое, что я хотел бы предложить, это убедиться, что ваш код действителен, если вы хотите использовать его в браузере.

Отправленный код содержит 33 ошибки.

FF не так требователен, как некоторые другие браузеры, и дает много возможностей с точки зрения корректного кода.

Попробуйте проверить и исправить проблемы с валидностью, а затем проверить еще раз; это могло бы выглядеть немного лучше.

Answer 3

Попробуйте проверить ваши CSS и HTML, если это возможно. Это обычно помогает устранить самые большие глюки.

validator.w3.org

Answer 4

Переместите вашу таблицу календаря влево