Box shadow leaving strip at bottom of image?

Hey all, very new to really messing with CSS and I can't seem to figure out what's going on here. On the site I'm working on there are several flags lined up like the ones in the image, and I've added a hover effect on mouse over with a little box shadow. However, anytime the hover effect is applied to the flag image, there's that little strip of white added to the bottom of the image and I can't seem to figure out what's causing it, although I know it has something to do with the box shadow.

For the box shadow I have:

box-shadow: 0 20px 20px rgba(0, 0, 0, 0.23);

Would really appreciate any help!


  • This forum is a broken POS, so maybe you tried to upload an image and it failed. You need to host images elsewhere and insert as HTML if you wanna embed in comments. You could just provide a link to the image if you can't figure it out.

    An image probably wouldn't help all that much anyway. Little details like the one you're describing are usually conflicting CSS. Only sure way to get an accurate answer is to provide the stylesheet you're applying, and a link to a URL where the behavior can be observed.
Sign In or Register to comment.