Доброго времени суток, мне как и всем верстальщикам, рано или поздно приходится сталкиваться с кроссбраузерностью и как правила все мучения зависают над IE, в моем случаи это ie8, ie9, ie10, ie11. Из перерытой мною тонны информации я понял что IE 8 не поддерживает следующие CSS3 свойства
rem
media queries
rgba(), hsla()
:last-child, :nth-child(), :first-of-type, …
:empty
:not()
calc()
.ttf, .otf, .woff fonts
multiple backgrounds
background-size
vw, vh, vmin, vmax
:checked, :valid, :invalid, :required
box-shadow
transforms (rotate, translate, skew, scale, matrix)
border-radius
opacity
В поисках универсального костыля, я наткнулся на PIE.htc но мои ужасные познания английского языка не дают мне достаточного продвижения в этом вопросе, по этому приходится обращаться в гуру "Костылей".
Переходим к пляскам с бубнами
Для
<div class="block">
пишу
.block{
width: 200px;
height: 200px;
border-radius: 50%;
behavior: url(../js/pie.htc);
}
И вуаля, работает. А вот такой код уже не работает
.block {
width: 200px;
height: 200px;
border: 1px solid black;
border-radius: 50%;
background: linear-gradient(to bottom, #CCC, #EEE);
-pie-background: linear-gradient(to bottom, #CCC, #EEE); /*ie 6-9 via PIE*/
behavior: url(../js/pie.htc);
}
Вроде все делал по как написано на ОФИЦИАЛЬНОМ сайте в документации
css3pie.com/documentation/supported-css3-features но большая часть написанного там у меня не работает, кто сталкивался с подобным, прошу помогите с освоением полной Кроссбраузерности IE по выше упомянутым свойствам.
На заметку, я перерыл очень много литературы, и до сих пор ее рою, НЕ нужно меня посылать по разным URL, я задал вполне четкий вопрос, если нечего ответить - промолчите :)