Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
356 views
in Technique[技术] by (71.8m points)

html - Removing white space from image on webpage

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

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

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;
}

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...