边框和图像之间的空间

Question

我试图设置一个适合图像的边框，但边框和图像之间有一些小空间。

我正在使用此示例http://jsfiddle.net/macwadu/sEz3N/2/

任何人都可以帮助我吗？

罐

Answer 1

删除保证金并添加20px（来自你的moz-border-radius）

http://jsfiddle.net/sEz3N/3/

Answer 2

删除图像的内嵌样式。像这样做css：

.imagePanel {   

  -moz-border-radius:10px;
  border-radius:10px;
  padding: 1px;  
  border:1px solid grey;
}

.imagePanel img {
  -moz-border-radius:10px;
  border-radius:10px;
}

像这样：http://jsfiddle.net/sEz3N/5/

Answer 3

当我从图像中删除边距时，这似乎很好

$(document).ready(function() {
    theWidth = $(".imagePanel img").width();
    $(".imagePanel").css('width',theWidth+(theWidth*.01));
    $(".imagePanel").css('padding',theWidth*.01);
});

Answer 4

演示：http://jsfiddle.net/gion_13/sEz3N/7/
你实际上可以将边框放在实际图像周围......为什么要制作一个覆盖边框部分的包装？这样你只需要添加一些填充就可以了。