Веселый рендеринг в IE для HTML + CSS

Question

http://churchcentral.com/rfi.php?site_id=4&division_id=2144 - это страница, и только IE является проблемой. Если вы заметили, текст в конце «Шаг 2», текст «следующая страница» повторяется. Если вы выделите любую из этих частей текста, IE выделит их оба.

Это ошибка в IE? Мы видели, как это происходит на одной странице, но с разным текстом, в разное время, и это вызывает проблемы у некоторых людей.

Любая помощь будет отличной.

Answer 1

Есть ли конкретная причина, почему этот абзац применяется float: left? Если я удалю это, он отобразится правильно.

Кроме того, вы копируете точно такой же стиль, как и <h2> выше для шага 1. Вы можете просто использовать <h2> вместо <p> для шага 2, а? Я имею в виду, что ваш план довольно странный.

ETA: Почти все на этой странице, поплавки, что приводит меня к очень большой знак вопроса:

Как я понимаю, это очень простой (макет-накрест) сверху-снизу страницы. Я думаю, вы можете упорядочить многие вещи в этом CSS.

Вы можете легко играть с отключением или изменением определенных правил CSS в инструментах разработчика IE.

Answer 2

Если вы удалите свойства clear и float этого абзаца, вы увидите в firefox, что, вероятно, причиной этого является плавающее текстовое поле над ним. Поскольку все эти float, вероятно, IE не могут справиться с этим в определенный момент, IE никогда не был лучшим при обработке float. Я не вижу, что такое поплавки, так что вам это действительно нужно?