子div怎么超出父div底部了？

Question

父div中有两个子div，这两个字div的display都是inline-block，想让他们一个在左边，一个在右边，填满父div，但是为什么其中一个子div会超出父div底边，子div不应该始终在父div之内吗?(前端小白)

html、css和结果如下：

<div class="intr-row">
    <div style="width: 80px; height: 100px; line-height: 100px; display: inline-block; font-size: 14px; background-color: #2E58FF;">
        自我介绍
    </div>
    <div style="width: 620px; display: inline-block; background-color: #FF0000; height: 100px;"></div>
</div>

.intr-row{
	height: 100px;
	background-color: #00FFFF;
	font-size: 0;
}

Answer 1

自我介绍那个块里添加一个 vertical-align:top;

具体参加：https://www.imooc.com/wenda/detail/352303、https://www.cnblogs.com/zxjwlh/p/6219896.html