#html #css #internet-explorer #cross-browser
#HTML #css #internet-Explorer #кросс-браузерный
Вопрос:
Конечно, есть более простой способ сделать это. Теги комментариев IE были единственным способом, которым я мог заставить страницу выглядеть правильно в IE 7 и ниже.
РЕДАКТИРОВАТЬ: я не слишком уверен, почему за это проголосовали. Это законный вопрос. Если кто-то и должен проголосовать против, так это те, кто обсуждал это на данный момент. Никто не отвечает на вопрос. Они либо слишком расплывчаты, либо говорят мне, чего не следует делать. Я уже знаю это. Вот почему я спрашиваю, какой способ лучше.
Комментарии:
1. Можете ли вы объяснить, что пошло не так без таблицы и условий браузера? Вы сделали это, чтобы сделать форму плавающей правильно?
2. предоставить отдельную таблицу стилей для ie7 и просто перестроить divs специально для нее?
3. Вы можете сделать это без таблиц в ie7. с плавающей точкой: слева; выравнивание текста: по левому краю и т.д. Но если вы собираетесь использовать таблицы, можете также использовать таблицы для всех браузеров
4. IE7 не поддерживает
display: tableи друзей, поэтому вам придется искать уродливые обходные пути, если вы хотите это использовать. К счастью, я не понимаю, зачем вам нужно использоватьdisplay: tableдля создания этого макета, поэтому вы должны просто иметь возможность переделать его, используя методы, поддерживаемые IE7. Будет ли HTML / CSS, делающий это, хорошим ответом?5. @Terr, ни один из divs не будет встроенным, если я все это удалю. @thirtydot, если я удалю
display: table;из формы, то содержимое формы не будет располагаться по центру по вертикали.
Ответ №1:
Вам не нужно использовать html-таблицу только для того, чтобы заставить IE7 работать, и фактически вам не следует использовать их вообще, если вы не собираетесь отображать табличные данные.
Вместо всех этих запутанных условий просто используйте одно сразу после импорта таблицы стилей, чтобы добавить таблицу стилей, специфичную для IE.
Подумайте о создании другого контейнера для вашей формы, и вместо того, чтобы пытаться заставить форму отображаться в виде таблицы, используйте позиционирование, чтобы поместить ваш новый контейнер в угол. Это, скорее всего, хорошо переведется в более старые версии IE, и поэтому ваши специфические стили IE понадобятся только для исправления незначительных различий в коробочной модели.
Комментарии:
1. @shanethehat, я понимаю, что мне не следует использовать таблицы, но это единственный способ заставить это работать, который я могу придумать. Не могли бы вы предоставить какой-нибудь псевдокод относительно того, какие значения
displayзаставят его работать И будут располагаться по вертикали по центру?2. Почему вам нужно беспокоиться о центрировании по вертикали? Родительский элемент формы имеет жестко заданную высоту в CSS, поэтому вы не можете просто центрировать его с помощью padding-top?
3. Если вам действительно нужно отцентрировать форму по вертикали и вы знаете высоту вашей формы, вы можете настроить форму на использование абсолютного расположения на 50% сверху, а затем использовать отрицательное верхнее поле в половину высоты формы.
4. @shanethehat, хорошо, теперь, как мне сделать, чтобы форма была такой же в IE 7 и ниже?
5. Извините за задержку, работа иногда мешает. Это мое решение: jsfiddle.net/yW3An/7 . Я слегка реструктурировал ваш HTML, добавил несколько дополнительных идентификаторов и классов и многое изменил в CSS. Тестировался в IE7, но у меня нет доступа к IE6. Итак, теперь вам просто понадобится условный комментарий для добавления таблицы стилей, специфичной для IE, чтобы исправить любые незначительные несоответствия в позиционировании.