html - 将 select 元素和 div 设置为相同的高度

Question

如何设置btn高度与sela高度相同同时:

• 同时保持 font-size:1.1rem
• 在 btn 中保持文本 PLUS 垂直居中

.wrap{background:green; text-align:center;}
.sela{display:inline-block; margin:0 9px; font-size:1.1rem; outline:none; border:none;}
.btn{display:inline-block; margin:0 9px; background:white; color:black; font-size:1.1rem;}

<div class='wrap'>
<select class='sela'>
<option>lorem ipsum</option>
</select>
<div class='btn'>PLUS</div>
</div>

Answer 1

请检查code example with fixes on Codepen .

这里需要使用flex:

.wrap{background:green; text-align:center; display: flex; justify-content: center;}
.btn{display:flex; margin:0 9px; background:white; color:black; font-size:1.1rem; align-items: center;}