html - Removing white space from image on webpage

Question

I'm trying to figure out why my image is in a box. I ran a little script that nulls out all the white space in my image, but when I try to use it on my site, my image has a white box around it.

I tried setting margin and padding to 0, I also tried setting the display to block, but still it persists, I appreciate any help, I'm sure this is simple, but I'm not a front end developer unfortunately (:

<div class="img_style">
  <a href="link" class="btn btn-lg btn-default">
    <img src="imgSrc.png" style="block">
  </a>
</div>

Currently the css is empty, but after trying first comment, it looks like this:

#img_style {
  style="border: none !important";
}

Remove white space from image

Image inside div has extra space below the image

Answer 1

First remove style="block" in image tag! Its false. Read about class and id, Link this css to your page

First way

.img_style a{
    border: none;
}

Second Way

.img_style a{
    padding: 0;
    border-radius: 0;
}

Third Way

.img_style img{
    margin : -10px -15px;
}