Tue, 2013-05-28 03:10
Hi everybody, i'm having trouble with a sahdow.
take a look:
The shadow of the huge immage does not appear in the black area.
Here is the source of that region
<div id="bests"> <div class="first" > <div class="bestsimg" onmouseover="javascript:setImgOverStyle();" onmouseout="javascript:removeImgOverStyle()" > <img src="images/Chrysanthemum.jpg" alt="" > </div> <!-- aqui vai imagem --> </div> <div class="first"> <div class="second"> <div class="bestsimg2" onmouseover="javascript:setImgOverStyle2();" onmouseout="javascript:removeImgOverStyle2()" > <img src="images/Chrysanthemum.jpg" alt="" > </div> </div> </div>
and here is the CSS
.bestsimg{ overflow: hidden; width: 100%; height: 100%; z-index: 50; } .bestsimg2{ overflow: hidden; width: 100%; height: 100%; } .bestsimgover{ box-shadow: 0px 0px 12px #000; z-index: 50; /*transform: scale(2,4); /*-ms-transform: scale(2,4); /* IE 9 */ /*-webkit-transform: scale(2,4); /* Safari and Chrome */ } .bestsimg img{ position:relative; top:50%; left:50%; margin-top:-50%; margin-left:-50%; } .bestsimg2 img{ position:relative; top:50%; left:50%; margin-top:-50%; margin-left:-50%; }