Drop Shadow: No Bottom
3PCo
Registered Users Posts: 65 Big grins
Trying to add a drop shadow to the main picture on my home page, I added the CSS
.sm-page-home .sm-page-widget-2443618 img {box-shadow:4px 4px black;}
The shadow appears and extends 4 px to the right of the image, but does not appear at the bottom. This seems to be because the image completely fills the div in the vertical dimension, so there is no room for the shadow at top or bottom.
Does anyone know what to do?
Thanks!!
af
.sm-page-home .sm-page-widget-2443618 img {box-shadow:4px 4px black;}
The shadow appears and extends 4 px to the right of the image, but does not appear at the bottom. This seems to be because the image completely fills the div in the vertical dimension, so there is no room for the shadow at top or bottom.
Does anyone know what to do?
Thanks!!
af
0
Comments
It is necessary to add a margin to the figure which is to "cast" the drop shadow. In my case, I had padding but no margins top and bottom. On the left and right, since the image didn't fill the page completely, there was room for my drop shadow. But I had to add a margin to the bottom, since I had no vertical space available.
http://www.pillarpointposter.com