Есть ли умный способ не запускать 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 не нужны.