CSS box-shadow не работает в IE или Safari

Question

#keyboard {
position: fixed;
background: #eee;
display: none;
border: 1px solid #ccc;
border-radius:7px;
width: 950px;
height: 300px;
padding: 5px;
cursor: move;
background-image:url('BackgroundImage.jpg');
box-shadow: -5px -5px 5px 5px #888; 
-moz-border-radius: -5px -5px 5px 5px #888;
-webkit-border-radius: -5px -5px 5px 5px #888;

}

В верхнем css-коде это нормально в браузере Firfox. Но я не могу отобразить тень в IE8 или IE6 и сафари.

box-shadow: -5px -5px 5px 5px #888; 

Пожалуйста, дайте мне знать решение.

Answer 1

Чтобы предложить пользователям IE эффект, похожий на box-shadow, я обычно использую проприетарные фильтры MS, вот выдержка из моего css:

-moz-box-shadow: 2px 4px 19px #333333;
-webkit-box-shadow: 2px 4px 19px #333333;
box-shadow: 2px 4px 19px #333333;
-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=6, Direction=115, Color='#333333')";
filter: progid:DXImageTransform.Microsoft.Shadow(Strength=6, Direction=115, Color='#333333');

Очевидно, что эффект на IE отличается,но играя с различными параметрами, вы можете стать очень близкими (или, по крайней мере, приемлемыми) к вашим ожиданиям в каждом браузере

Answer 2

Тень блока css3, не поддерживаемая в ie8 и более старых браузерах, но все же мы можем получить это, используя css3pie script

Answer 3

Также попробуйте prefixr.com, мне очень помогает совместимость браузера css3