div与子标签img之间的间隙

问题的情况如下:

image.png

即背景div与子img没有完全对齐，有一个不可预知的像素差值。图片中蓝条即是背景div漏出来的颜色。
我的结构如下:

<div className="bgblock">
      <img className="innerimg" src={item.coverImgUrl} />
 </div>

css样式如下:

.bgblock
      {
        width:100%;
        position: relative;
        background-color: blue;
        // 背景图片
        .innerimg
        {
          // vertical-align: bottom;
          width:100%;
          height:auto;
          -webkit-border-radius: 4px;
        }
}

即bgblock用图片的高度撑开，然而就是出现了如上图片的奇葩问题...
一番分析代码，以及实际解析的样式并木有发现问题。又是一番搜索...
最终解决方案如下：
在子img里面设置 vertical-align: bottom;顺利解决问题，不知为何，奇葩。