显示来自Facebook图形的图像显示在顶部保留。为什么？

Question

为什么当我从facebook图片设置图片src图片时，图片保留顶部（顶部有一个空格）？

这里是IMG

$('.raters-div').append("<div class='rater-img'><div class='rate-value'>"+value+ 
    "</div><img src='https://graph.facebook.com/"+user+"/picture' class='img123' /></div>"); 

CSS样式

.rater-img{ 
    float: right; 
    background-color: red; 
    margin-right: 1px; 
    height: 30px; 
    width: 30px; 
    padding: 0px; 
    margin-top: 3px; 
} 
.img123{ 
    margin: 0px; 
    padding: 0px; 
    width:30px; 
    vertical-align: top; 
} 
.rate-value{ 
    top: 17px; 
    right: 16px; 
    position: relative; 
    color: #fff; 
    font-size: 11px; 
    font-weight: bold; 
    padding: 1px; 
    text-align: center; 
    height: 11px; 
    width: 11px; 
    z-index: 500; 
    background-color: #000; 
} 

Answer 1

也许html代码，因为你使用vertical-align: top和你的形象是默认display: inline？删除该行或将其设置为vertical-align: middle以垂直居中。

空白空间可能是因为.rate-value有padding: 1px;