Стратегия для исправления ошибок макета в IE6?

Question

Каков наилучший способ устранения ошибки макета в IE6? Каковы наиболее распространенные ошибки или проблемы, на которые следует обратить внимание при попытке выяснить, почему ваша страница внезапно выглядит как закодированная ее обезьяна?

Answer 1

Перво наперво

Получите себе Панель инструментов разработчика Internet Explorer . Это спасатель жизни и прекрасно работает с IE6 и / или IE7. Он не заменяет панель инструментов веб-разработчика или Firebug для Firefox, но лучше, чем ничего.

Знай своего врага

Читайте о причудах IE & mdash; в частности hasLayout и переполнение и тому подобное. Есть также много тонкостей CSS, которые вам придется либо обойтись без , либо найти альтернатив . Посмотрите, сколько популярных JavaScript инструментариев / каркасов / библиотек решают различные проблемы .

Рим не был построен за один день

Чем больше вам придется работать с ним, тем больше вы будете помнить от руки и искать его не придется так часто. Там просто нет замены для опыта в этом. Однако, как отмечают некоторые, в сети есть большие ресурсы. Позиция - это все определенно там.

Answer 2

http://www.positioniseverything.net/ наверняка решит вашу проблему.

Он предоставляет исчерпывающее и подробное описание ошибок браузера, а также варианты их устранения А читать надо, на мой взгляд,

Answer 3

Хороший способ начать изучение того, как IE работает с страницей, - включить красные границы на разных элементах с помощью CSS (border: 1px solid red;). Это сразу скажет вам, является ли это проблемой на полях или дополнением, насколько широким является элемент на самом деле и т. Д.

Answer 4

Заметил, что пост Марка в -2 = D. Он говорит только «прибегнуть к таблицам», даже если они дуют, потому что в плохих браузерах, таких как IE6, некоторые из сломанных команд CSS работают только в таблицах (кто знает, почему ... черт возьми, Билл Гейтс !!!) Вот хороший справочник, чтобы увидеть, что работает и не работает, насколько CSS. http://www.quirksmode.org/css/contents.html. Это отличный справочник, чтобы проверить, какие классные эффекты работают / не работают с различными широко используемыми браузерами. Кроме того, всегда имейте план действий для пользователей, которые используют браузер IE6 (хотя он почти столь же стар, как и механическая грязь), поскольку многие компании все еще используют старые браузеры (включая некоммерческие / страны третьего мира и т. Д.). создайте выпадающее меню с ошибками, которое выглядит ПУТЬ лучше, чем стандартное горизонтальное меню, но создайте вторичное, специально для IE6, которое становится значением по умолчанию, когда страница получает запрос от браузера IE6.

Answer 5

Виновная модель, как правило, является виновником. По сути, это означает, что любой div, который вы пытаетесь позиционировать и использовать неподдерживаемый CSS, вызовет эту проблему.

Это может случиться, если вы используете min- {width, height} или max- {width, height}.

это отличный справочник для проверки совместимости с различными версиями.

http://www.aptana.com/reference/html/api/CSS.index.html

Answer 6

Я использую Выбор браузера Рафеля Лимы , когда мне нужно настроить различия между браузерами IE / Standards. Это значительно уменьшает использование «хаков» в вашем HTML для решения типичных проблем.

Вы можете настраивать операторы CSS для разных браузеров или даже для разных версий браузеров (Hello IE 6). Это очень просто реализовать, но требует, чтобы у пользователя был включен JavaScript (большинство делают).

.thing {....}

.ie .thing {....}

.ie6 .thing {....}

Answer 7

Распространенной проблемой является заполнение, не добавляемое к ширине элемента блока. Так что для макетов div, избегайте использования padding и вместо этого используйте элементы внутри них для определения заполнения.

Answer 8

У меня есть простая стратегия, которая работает каждый раз.

Во-первых, я разрабатываю сайт с использованием общепринятого CSS, чтобы хорошо выглядеть в Safari и Firefox 3. Подробнее о поддержке браузера см. w3schools.com .

Затем я вхожу в IE6 и IE7 и изменяю CSS с помощью условных включений .

Это не требует взлома и позволяет работать с различными браузерами (IE6 и IE7 имеют отдельные проблемы).

Большинство проблем, которые вы обнаружите, связаны с неподдерживаемыми функциями в IE (например, минимальной шириной), ошибками в блочной модели (IE добавляет невидимые дополнительные отступы (3 пикселя) для некоторых блоков) или проблемами позиционирования. Сначала обратитесь к ним, поскольку они часто являются проблемой.

Answer 9

Теоретически, используйте CSS, совместимый с ошибками компоновки IE6, используйте только общеизвестные обходные пути (фильтры CSS и HTML) и используйте для них код таким образом, чтобы не нарушать совместимость, тестируйте на причуды / строгий режим.

На самом деле прибегают к таблицам.

Answer 10

Я полагаю, что у этого вопроса слишком много возможностей.

Подтвердите ваш код, и если боль не исчезнет, ​​удачи.

Единственные реальные решения, как и в случае с любым другим типом ошибки, - это поиск решения в Google или попросить кого-то, кто знает (то есть: передайте нам точную проблему здесь в stackoverflow).

Вы можете использовать панель инструментов IE Dev, чтобы подобрать идею, но многие ошибки являются случайными, необъяснимыми и эзотерическими. IE: ошибка гильотины, ошибка дублирования случайных предметов и т. Д., Список можно продолжать, и вы можете буквально тратить часы, буквально бездельничая с глупыми переменными везде и ничего не добившись.