box-shadow IE8 не работает на IE8
Я просмотрел все актуальные темы, но не смог найти решение, поэтому создал этот вопрос. Я пытаюсь реализовать box-shadow на IE8 И он не работает.. Он работает на IE9+?
У меня есть простой div:
<span id="controls" class="box-shadow">
<input id="start" type="text" placeholder="Get Directions: Enter Address or Postcode"/>
<input id="end" type="hidden" value="Text" />
</span>
И CSS:
#controls.box-shadow{
background-color: white;
font-size: 13px;
position: relative;
padding: 5px;
z-index: 10000;
float: right;
height: 35px;
width: 96%;
margin-left: 20px;
}
.box-shadow{
box-shadow: 0px 0px 15px 0px #232361;
-moz-box-shadow: 0px 0px 15px 0px #232361;
-webkit-box-shadow: 0px 0px 15px 0px #232361;
-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#232361')";
filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#232361');
}
#start{ width:82%; height:27px; border:none; padding:5px}
3 ответа
Решение
Box-shadow изначально не работает в IE8, но вы можете использовать polyfill для CSS3.
Вот рабочий пример: http://css3pie.com/
Вы должны применить polyfill к вашему элементу так
.box-shadow {
box-shadow: 0px 0px 15px 0px #232361;
-moz-box-shadow: 0px 0px 15px 0px #232361;
-webkit-box-shadow: 0px 0px 15px 0px #232361;
behavior: url(PIE.htc);
}
CSS3 box-shadow
не поддерживается в IE8 или ниже. Лично я бы не беспокоился о поддержке IE8, но если вам нужно, то у MS есть DropShadow
это было примерно с IE5.5.
Если вы не хотите использовать какой-либо сторонний плагин, вы можете обратиться к этому сайту: