Исправление или обходной путь для диалогового окна jQuery в IE6 — основные проблемы с макетом, когда диалоговое окно содержит форму.

StackOverflow https://stackoverflow.com/questions/400728

Вопрос

Я работаю с диалоговым окном jQuery, содержащим форму.В ie6 над формой есть пара необъяснимых дюймов отступа.Когда я удаляю форму из разметки, самые серьезные проблемы с версткой уходят.Я попробовал это без темы (по умолчанию), Flora и моей темы themeroller, и у всех них, похоже, одна и та же проблема.

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

Я пробовал устанавливать свойства CSS в самой форме, такие как плавание, устранение полей и отступов, встроенное отображение и т. д., но пока форма существует, существует дополнительное пространство.Кто-нибудь смог найти обходной путь для этого?Я бы предпочел не взламывать его и иметь элементы управления формой без тега формы.

Спасибо.

Это было полезно?

Решение

Всякий раз, когда мне нужно создать тему CSS для существующего сайта, форума, виджета и т. д.Я всегда начинаю с удаления всех таблиц стилей, нормализации всех полей и заполнения до 0 для каждого основного элемента HTML DOM.Это особенно важно, когда речь идет о встроенном CSS.

Вам следует попробовать удалить любой встроенный CSS в самом элементе формы.Затем попробуйте что-то вроде:

form {
    margin: 0;
    padding: 0;
    overflow: hidden;
}

Устранение переполнения в IE6 часто решает множество проблем с маржой.Попробуйте временно установить границы для всех элементов HTML, используя следующий стиль, чтобы увидеть, не переполняют ли какие-либо предыдущие элементы пространство формы.

* {
    border: solid 1px #FF0000;
}

Если вы видите границы, наложенные на форму, вам также следует попытаться ограничить переполнение этого элемента.

Другие советы

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

Если у него нет типа документа, браузер будет отображать его в нем. "причуды" режиме и многие вещи будут выглядеть не совсем правильно.

Раньше у меня была аналогичная проблема с кнопками и необъяснимыми полями.В IE6 есть некоторые элементы, которые наследуют поля своих родительских элементов.Очень странно...

Попробуйте это исправление: http://blog.netscraps.com/internet-explorer-bugs/ie6-ie7-margin-inheritance-bug.html

Попробуйте что-то вроде этого:

#yourDiv { padding:1.2em; margin-right:2.4em; }

где #yourDiv — это идентификатор элемента div, содержащего ваши теги (у меня была проблема с входными данными).

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top