CSS box shadow not shown on bottom

I specify a box shadow for a span. The shadow only shows on the right. Something seems to cover the bottom side of the shadow. I tried resizing the span but this doesn't do it. I have this in the style specifications.

#feastsaint:hover span {
   display:block;
   width:385px;
   height:65px;
   margin-left: 120px;

    border:1p开发者_如何学JAVAx solid #808080;
    padding:2px;
    font-size:11px;
    border-radius: 5px;
    box-shadow: 3px 5px 8px #888;
    -moz-border-radius: 5px;
    -moz-box-shadow: 3px 5px 8px #888;
    padding: 5px 5px 5px 15px;
    background:#CCFFCC;

   /* border:1px solid #404040;
   background-color:#FFCCCF; */
   color:#404040;
   white-space: normal;
   z-index:99;  
}

What could be the problem?

NOTE: Couldn't upload the image for the box shadow.

Add some margin-bottom to your span.

#feastsaint:hover span {
     ....
     margin-bottom: 5px; // (play with this a bit till you get the desired effect)
}

you really should post more info about your problem such as the html code your trying to affect, that said try: change

#feastsaint:hover span

to

span#feastsaint:hover

I recently experienced some problems with Chrome on MAC. I just had to restart Chrome several times until it worked again. For me bitmaps and some images online were messed up (no vectors). Maybe just restart Chrome and look if it works. Otherwise just revise your CSS as the other answers suggest. Good Luck