box-shadow IE9

[jonathanwahlund]

Hello, my name is Jonathan Wahlund and I am responsible for the coding part of my friends blog, we made the blog look really nice when using chrome, FF and safari. But we run into one problem when it comes to IE9, the box-shadows does NOT show and it kind of destroys the design. If anyone know what the problem is would be great

the site name: http://legilimensblog.jonathanwahlund.se/

[TheDoc]

You have this:

It should be this:

[jonathanwahlund]

Changed it but the problem is not fixed, the box-shadow is still not displayed in IE9 :(

[TheDoc]

Very weird, and you’re in IE9? Are you sure the site isn’t somehow being displayed in IE8 Standards mode or something like that? If you go to developer tools it should say what mode you’re viewing the site in.

Try putting:

box-shadow: 0 0 50px #000000;

…last in the lineup, so after the ms- one.

[jonathanwahlund]

Thanks for the corrections :D, nothing of the above have changed anything about the IE9 not reading the shadows :(

[jonathanwahlund]

I checked, and it seems like the webpage actually is read as IE8, but I’m not sure, but if it is the case, how do I fix it?

[TheDoc]

You have this:

Try changing it to this:

[jonathanwahlund]

My internet explorer still reads the page as IE8, could it be something with:

[TheDoc]

Part of me is really thinking that you are using IE8… if you go to ‘About Internet Explorer’ does it say you’re using 9?

I just checked on my version of IE9 and the shadows are showing up fine.

[jonathanwahlund]

Yes, you are right, I have the IE8… I had no idea, I downloaded it some days ago, must been something that went wrong, thanks for the help :D

[TheDoc]

No problem!

[jonathanwahlund]

Now there is one more thing, in chrome and FF, the main menu is fading from red to black, in IE9, the main menu is only one color, how can I make the meny fade work in IE9? Alternative, how do I make so chrome and FF etc show how it is now and IE9 shows a picture as menu background instead?

[TheDoc]

I’m not really sure about IE9 support there. I know IE10 supports it:

/* IE10 */

background-image: -ms-linear-gradient(top left, #FFFFFF 0%, #00A3EF 100%);



/* Mozilla Firefox */

background-image: -moz-linear-gradient(top left, #FFFFFF 0%, #00A3EF 100%);



/* Opera */

background-image: -o-linear-gradient(top left, #FFFFFF 0%, #00A3EF 100%);



/* Webkit (Safari/Chrome 10) */

background-image: -webkit-gradient(linear, left top, right bottom, color-stop(0, #FFFFFF), color-stop(1, #00A3EF));



/* Webkit (Chrome 11+) */

background-image: -webkit-linear-gradient(top left, #FFFFFF 0%, #00A3EF 100%);



/* Proposed W3C Markup */

background-image: linear-gradient(top left, #FFFFFF 0%, #00A3EF 100%);

[TheDoc]

You can check here: http://caniuse.com

But it’s down today for SOPA.

[jonathanwahlund]

IE9 doesn’t seem to support the Gradients, thought I wounder how do I make only IE9 display an image I photoshoped instead of the Gradients as a background of the navigation menu?

[Author]

Posts