Есть ли умный способ не запускать CSS3Pie в определенных версиях IE с использованием классов?

Я пытаюсь заставить css3pie НЕ работать в ie7 для определенного класса. Я использую HTML5 Boilerplate, чтобы дать мне определенные классы IE для использования. То, что я пытался сделать, это

.ie7 .classname {
 position: absolute;
 background: #000;
}
.classname {
  css3pie: stuff;
  position: relative
  background: #fff;
}

Но это, похоже, не работает, css3pie все еще обрабатывается.

Кто-нибудь имеет какие-либо идеи, что еще я мог бы попытаться не запускать исправления css3pie?

3 ответа

Если вы используете DHTML-версию PIE (pie.htc), объявляйте поведение только тех элементов, которые вы хотите. В моем случае у меня есть pie класс, который я добавляю к элементам, которым требуется круговая диаграмма, затем объявляю мой CSS следующим образом:

.pie { behavior: url(pie.htc); }

В вашем случае вы можете сделать это:

.ie6 .pie, .ie8 .pie, .ie9 .pie { behavior: url(pie.htc); }

Или настройте условные комментарии, чтобы добавить .ienot7 класс в IE 6, 8 и 9:

<!--[if lt IE 7 ]> <html class="ie6 ienot7"> <![endif]-->
<!--[if IE 7 ]>    <html class="ie7"> <![endif]-->
<!--[if IE 8 ]>    <html class="ie8 ienot7"> <![endif]-->
<!--[if IE 9 ]>    <html class="ie9 ienot7"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html class=""> <!--<![endif]-->
.ienot7 .pie { behavior: url(pie.htc); }

У меня сложилось впечатление, что вы должны были явно применить css3pie к объявлениям, которые вы хотели обрабатывать, например так:

.border-radius-5 {
    -webkit-border-radius : 5px;
    -moz-border-radius : 5px;
    border-radius : 5px;
    position:relative;
    behavior: url(/css/PIE.htc);
} 

Задавать behavior: '' только в IE7. Например:

.classname {
    behavior: url(pie.htc);
}
.ie7 .classname {
    behavior: '';
}

Это хорошо, потому что изменения HTML не нужны.

Другие вопросы по тегам