如何去除select选中和非选中时造成的同div中文字上下浮动

<div>
    ASDAD：
    <select style="width:20%;vertical-align: top;" name="ranking">
        <option value=""></option>
        <option value="1">A</option>
        <option value="2">B</option>
        <option value="3">C</option>
        <option value="4">D</option>
    </select>
</div>

在select选项中，添加vertical-align: top;可以避免select选中项造成的浮动