Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Box shadow in IE7 and IE8

Tags:

I want to implement box shadows in IE7 and IE8. I have tried everything without succeeding. Here is the css that I am using to apply colored shadow to a div:

.bright{     position: absolute;     z-index: 1;      -moz-box-shadow: 0px -3px 55px 20px #147197;     box-shadow: 0px -3px 55px 20px #147197;     -webkit-box-shadow: 0px -3px 55px 20px #147197;     behavior: url(ie-css3.htc); } 

This ie-css3.htc file is a solution to IE shadow problems. But it only gives black shadows, not colour shadows. I tried:

filter: progid:DXImageTransform.Microsoft.Shadow(color='#969696', Direction=100, Strength=13); 

But it creates a directional shadow, and I want an omni-directional shadow. Also tried blur filter but it needs to have additional divs which is unadvisable in my current case. Any expert opinion on this problem ?

like image 805
Shades88 Avatar asked Nov 18 '11 11:11

Shades88


2 Answers

Use CSS3 PIE, which emulates some CSS3 properties in older versions of IE.

It supports box-shadow (except for the inset keyword).

like image 98
thirtydot Avatar answered Sep 18 '22 16:09

thirtydot


in ie8 you can try

-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=5, Direction=135, Color='#c0c0c0')";  filter: progid:DXImageTransform.Microsoft.Shadow(Strength=5, Direction=135, Color='#c0c0c0'); 

caveat: in ie8 you loose smooth fonts for some reason, they will look ragged

like image 29
iamari Avatar answered Sep 18 '22 16:09

iamari