CSS-хаки для IE 8

Продолжаем тему Internet Explorer 8. Освоим CSS-хаки:

1. Быстрое решение:

.ie8only { color /*\**/: #fff\9 }

Работает только в Standards Mode

2. Более разумный подход к вопросу:

В файле стилей для IE, подключеном через условный комментарий создаем такую структуру:

html>/**/body #id { property: value; }

Почему именно в отдельном файле? Потому что такую конструкцию прочтут все современные браузеры, включая IE8. Нужно помнить, что в таком случае все остальные хаки, предназначеные для IE6/7, должны быть прописаны через их собственные специфичные хаки (тогда IE8 ничего не заподозрит):

  • IE 6 — * html
  • IE 7 — *+html
Эта запись была опубликована в рубрике CSS. Вы можете следить за комментариями к этой записи.

Комментарии

  1. Сергей написал:

    А почему бы не отдать ИЕ8 свой цсс, а для 6-7 го или отдельно свои или один общий через все те же условный комментарии? И вообще я только один раз под 8-й вынужден был писать хак, когда прозрачность была нужна.

    • Никита написал:

      Потому-что это дополнительный запрос, который увеличивает время загрузки

  2. Михаил написал:

    если подключаем отддельный файл для IE и в нёь отделяем IE 6 через * html, а для IE 7 – через * > html, то зачем ещё писать хаки для IE 8? Либо я что-то не понимаю, либо что-то не дописано в посте.

  3. Сергей написал:

    Всем, кто почитает этот пост – вот что я хочу сказать:
    как я уже говорил один раз все таки пришлось писать хак, потому что opacity IE8 не понимает и ему нужно было подключить отдельный цсс, чтобы не засорять основной цсс и также не хотелось скармливать все то, что необходимо для 6 и 7 версий. Так каждый браузер получил свой цсс, плюс все версии ИЕ получили каждый свой ОТДЕЛЬНЫЙ цсс. (на самом деле я объединяю стили для 6 и 7 версий, но сейчас речь не об этом)
    Зачем писать хаки? Согласен, этого не нужно делать, нужно как я и говорил подключать отдельные файлы стилей.
    Ещё я думаю что Михаил вот что имел в виду – зачем мне разные цсс для разных версий ИЕ? Ведь я могу написать без хаков в цсс (подключенный через условные комментарии) просто так для ИЕ8, а для других версий я отделяю применение через хаки. Затем, что вы напишете какое-то свойство и правило без хаков, а оно возьмет и сработает для всех версий. Что в итоге повлечет написание ещё и хаков, которые отключат для других версий это правило.
    Ну и могут возникнуть частные случаи осложнений, о которых и гадать не хочется, поэтому вот как я бы советовал – разным версиям ИЕ отдавать ОТДЕЛЬНЫЕ, подключаемые через всем известные комментарии, ЦСС и уже в них, понимая где что и как отразится на отображении в браузере, использовать хаки.

    Надеюсь этот комментарий для кого-нибудь прояснит как надо делать и в результате я не увижу в чьем-нибудь коде хаков для ИЕ8 =) Скажем я думаю, что автор поста просто хотел показать, как можно делать, но я ставлю под сомнение, нужно ли так делать. Возможно Михаил тоже и мы друг друга поняли =)

  4. Геннадий написал:

    Я обычно, если для IE нужно не так и много места – пишу хпки прямо в основном css
    Отдельно выношу файл, только если не хосу загромождения
    Сколько раз пробовал – одинаково работает (с подключением и прописанием inline)

  5. Curly Brace написал:

    Сергей, по большому счету я с вами согласен, но. Зачем множить запросы к серверу, разделяя все стили для ИЕ на отдельные файлы? Тем более что практика показывает что стилевых правил там не много.

    Михаил, потому что стили, выписаные без хака под определенный браузер, будут прочитаны всеми версиями IE.

    Геннадий, валидация CSS вас не интересует?

  6. Сергей написал:

    Curly Brace, вы сами ответили на ваш вопрос – “Геннадий, валидация CSS вас не интересует?”
    Если вы имели в виду только версии ИЕ, то вот какая у меня логика – для ИЕ6-7 через один комментарий подключается один и тот же цсс, т.е. для ИЕ6-7 происходит загрузка ещё одного цсс. Для ИЕ8 я не подключаю никаких доп. стилей, так как это не требуется, исключая того случая. Но даже тогда для ИЕ8 загружался отдельный цсс. Что получается – что если ИЕ8, то 2 цсс, если ИЕ6-7 то снова 2 цсс загружаются – никаких лишних запросов.

    Вопросы?

  7. Curly Brace написал:

    Я запутался в вашем комментарии, извините.

  8. Сергей написал:

    Ничего, я похоже не очень хорошо умею объяснять, это правда :) Если ещё какие-нибудь вопросы, то задавайте.

  9. Ademar написал:

    А нет ли хака который поймет тольео ie8? По типу того для ie7 ?

    *:first-child+html .style {
    background: #00a800;
    }

  10. Дин написал:

    Офигенно, Денис! Хорошие трики для программистов IE. Правда, пора бы уже без хаков всё это дело оформлять, особенно в IE8.

  11. Артём написал:

    Всем, кто предлагает выносить стили в отдельные файлы:
    Вы что-нибудь вообще слышали о клиентской оптимизации???

  12. gordi написал:

    Более простой css hack для IE8
    .XXX {color:#000/;}

    • sphinxian написал:

      Да? и у вас он работает?
      а в оригинале он выглядит как
      .hack_ie8 {color:#f00/;}

  13. Sequestro написал:

    Друзья!
    Мой девиз – каждому по потребностям.
    Я скорее программист, нежели дизайнер, и потому решил эту проблему по-своему.
    В кратце: Тип и версию браузера определяю на серверной стороне (по заголовку). И далее, бесхитростным образом включаю в документ именно тот CSS, который нужен.
    (Естетственно, CSS, читаемый корректно, подключается файлом.)

Leave a Reply

Your email is never published nor shared. Required fields are marked *

*

You may use these HTML tags and attributes:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>