為什么等高inline-block元素不在同一高度上?

效果如圖：

html:

<div id = "bg6">
    <div id = "bg6_left">
        <div>新世界</div>
        <div>TIME</div>
        <div>@新世界-北京</div>
        <div>2016.04.01</div>
    </div>
    <div id = "bg6_right">
        <div id = "bg6_wrap">
            <div>新世界／01</div>
            <p>新世界是個新世界是個新世界是個新世界是個新世界是個新世界是個新世界是個新世界是個新世界是個新世界是個新世界是個新世界是個新世界是個新世界是個新世界是個</p>
            <input type="submit" name="" id = "bg6_btn" value="更多詳情">
            <div id = "cir"></div>
        </div>
    </div>
    </div>

css:

#bg6 {
    width: 1400px;
    height: 660px;
    letter-spacing: 0px;
    /*word-spacing: -2px;*/
}
#bg6_left {
    display: inline-block;
    width: 1000px;
    height: 660px;
    background:url(run.jpg);
    background-size: cover;
    text-align: center;


}
#bg6_right{
    display: inline-block;
    width: 400px;
    height: 660px;
    background-color: #aaa;
    margin-left: -5px;
}
#bg6_wrap {
    display: inline-block;
    width: 400px;
    height: 660px;
}

按道理說二者是line-box，底部在同一水平線的，為啥會有高度差？