Chrome bug中的border-radius?

Dor*_*rel 6 html css webkit google-chrome border

我在chrome中的border-radius有问题,这是我的代码:

img{
border-radius: 24px;
border: 2px solid #c7c7c7;                 
-moz-border-radius:24px; 
-webkit-border-radius: 24px;
}
Run Code Online (Sandbox Code Playgroud)

在mozzila它工作正常,但在Chrome上它看起来很有趣......在mozzila上我可以看到一个与我的图像接壤的圆圈,但在铬上,圆圈会剪切边框,我只能看到直线

截图:http://postimage.org/image/27turq0mc/

你能帮我吗?

Sot*_*ris 6

这可能是一个铬虫.一个解决方案可能是img用a 包装div并生成以下css:

img{                
    -moz-border-radius:24px; 
    -webkit-border-radius: 24px;
    border-radius: 24px;
    display:block;
}
div {
    border: 2px solid #c7c7c7; 
    border-radius: 24px;
    -webkit-border-radius: 24px;
    width:40px; /* the width of image */
    height:40px; /* the height of image */
}
Run Code Online (Sandbox Code Playgroud)

演示: http ://jsfiddle.net/EnmMp/1/