圆角周围的Chrome图像边框消失

nic*_*hvi 5 css google-chrome rounded-corners css3

因此,这就是问题所在:http : //bildr.no/view/927562

仔细看看:http : //bildr.no/view/927563

如您所见,每个角的边框变为不可见。这是图像的CSS代码:

#contentImage {
  float: left;
  border: 1px solid #C4C4C4;
  border-radius: 8px;
  margin-right: 25px;
}
Run Code Online (Sandbox Code Playgroud)


<img src="images/image.jpg" id=contentImage" />

任何帮助将大大赞赏:-)

met*_*ion 5

这是一个不幸的Webkit错误。我知道的唯一解决方法是将img转换为div,然后将img用作背景图像:

#contentImage {
  background: url('http://placehold.it/100x100') top left no-repeat;
  width: 100px;
  height: 100px;
  border: 1px solid #000; 
  border-radius: 8px;
  margin-right: 25px;
}
Run Code Online (Sandbox Code Playgroud)

http://jsfiddle.net/ybPKJ/