CSS Box-Shadow adds arbitrary white border to Div

Question

I\'m adding a box shadow to an element containing an img and it\'s creating an arbitrary white border on the bottom of the element. No border is being applied via CSS (and I

Answer 1

Either :

1. Add a display:block; to your img.
2. Define a line-height of 0px on your div.

An image is an inline element, so there is space for text, leaving that line.

Demo

Answer 2

And one more way to achieve this is to add virtical-align: top; to an img.

Answer 3

try display block for image.

.badge_image img {
    display: block;
}