Css box-shadow is not working in firefox

Question

Why this box-shadow is not working in firefox.. But it is showing shadow in chrome..

    #slideshow { 
        margin: 80px auto; 
        position: relative; 
        width: 701px; 
        height: 321px; 
        padding: 10px; 
        box-shadow: 0 0 20px rgba(0,0,0,0.4);
    }

    #slideshow > div { 
        position: absolute; 
        top: 10px; 
        left: 10px; 
        right: 10px; 
        bottom: 10px; 
    }

I gave important also but not working.. I am using jquery slider for that.. So i think html structure somehow messed up with the positioning.

Any idea..

Thanks !

Answer 1

Hi apply to the browser kit as like this

firefox and chrome

-

-moz-box-shadow: 0 0 20px rgba(0,0,0,0.4); 
-webkit-box-shadow: 0 0 20px rgba(0,0,0,0.4); 
box-shadow: 0 0 20px rgba(0,0,0,0.4);

Answer 2

To be available for all browser:

box-shadow: 0 0 20px rgba(0,0,0,0.4);
-moz-box-shadow: 0 0 20px rgba(0,0,0,0.4);
-webkit-box-shadow: 0 0 20px rgba(0,0,0,0.4);
-ms-box-shadow: 0 0 20px rgba(0,0,0,0.4);
-o-box-shadow: 0 0 20px rgba(0,0,0,0.4);